{% extends 'SonataAdminBundle:CRUD:edit.html.twig' %}
{% form_theme form with [
    'Form/file_upload_custom_echeance.html.twig',
    'admin/Form/form_admin_fields.html.twig',
    '@SonataForm/Form/datepicker.html.twig'
] %}

{#{% block formactions %}#}
{#    {{ parent() }}#}
{#    {{ dump(admin.subject) }}#}
{#    {% if admin.hasroute('edit') %}#}
{#        <a class="btn btn-success" href="{{ admin.generateObjectUrl('edit', object) }}">View</a>#}
{#    {% endif %}#}
{#{% endblock %}#}

{% block form %}
    {{ parent() }}
    <div class="modal fade" id="confirm-pp-modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                    <h4 class="modal-title">{{ "profil.tapsec"|trans }}</h4>
                </div>
                <div class="modal-body">
                    <div class="col-md-12">
                        <div id="divpass" class="form-group ">
                            <label id="pass_err" class="control-label" for="pass_admin"></label>
                            <input type="password" name="pass_admin" id="pass_admin" class="form-control" placeholder="mot de passe admin ici" >
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <div class="col-md-12">
                        <button type="button" class="btn btn-default" data-dismiss="modal">{{ 'Fermer'|trans }}</button>
                        <button id="pass_confirm" type="button" class="btn btn-primary">{{ 'Confirmer'|trans }}</button>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <script type="text/javascript">
        {{ render(controller('App\\Controller\\SwitchAnneeScolaireController::lesAnneeJs')) }}

        $(document).ready(function () {
            let datat = {}
            datat['specialiteNiveau'] = $('input.myspecialiteniveau-js').val()
            datat['specialite'] = $('select.myspecialite-js').val()
            datat['matiere'] = 1
            datat['classe'] = $('select.myclasse-js').val()
            datat['annee'] = $('select.myannee-js').val()
            datat['periode'] = 1

            {% if object.id %}
            $('.UserNameEleve').before("<div class='col-md-12'>" +
                "<button id='showpp' type=\"button\" class=\"btn btn-default\" name=\"btn_showpp\" data-toggle=\"modal\" data-target=\"#confirm-pp-modal\">" +
                "<i class=\"fa fa-eye\" aria-hidden=\"true\"></i> {{ "profil.affpass"|trans }}" +
                "</button>" +
                "</div>")

            {% endif %}
            $(document).on('click', '#pass_confirm', function () {
                let datarr = {};
                datarr['pass'] = $('#pass_admin').val();
                $.post('{{path('getverifpp')}}', datarr).then(function (data) {
                    if (data['rep'] === 'err'){
                        $('#pass_err').html(data['message'])
                        $('#divpass').addClass('has-error')
                    }
                    if (data['rep'] === 'success'){
                        $('.UserNameEleve').removeClass('hidden');
                        $('.myUserNameEleve-js').removeClass('hidden');
                        $('.myPassEleve-js').removeClass('hidden');
                        $('.myPassEleve-js').val($('.mypp-js').val());
                        $('.PassEleve').removeClass('hidden');


                        $('.UserNamePere').removeClass('hidden');
                        $('.myUserNamePere-js').removeClass('hidden');
                        $('.myPassPere-js').removeClass('hidden');
                        $('.myPassPere-js').val($('.myppPere-js').val());
                        $('.PassPere').removeClass('hidden');



                        $('.UserNameTuteur').removeClass('hidden');
                        $('.myUserNameTuteur-js').removeClass('hidden');
                        $('.myPassTuteur-js').removeClass('hidden');
                        $('.myPassTuteur-js').val($('.myppTuteur-js').val());
                        $('.PassTuteur').removeClass('hidden');



                        $('.UserNameMere').removeClass('hidden');
                        $('.myUserNameMere-js').removeClass('hidden');
                        $('.myPassMere-js').removeClass('hidden');
                        $('.myPassMere-js').val($('.myppMere-js').val());
                        $('.PassMere').removeClass('hidden');


                        $('#confirm-pp-modal').modal('hide');
                    }
                })
            });

            if ($('input.myspecialiteniveau-js').val() !== "") {

                $.post('{{ path('setSpecialiteAndNiveauAndClasseMatiereAjax') }}', datat).then(function (data) {
                    // console.log(data)
                    var $elsp = $("select.myspecialite-js");
                    var $elniv = $("select.myniveau-js");
                    var $elmatiere = $("select.mymatiere-js");
                    var $elclasse = $("select.myclasse-js");
                    let $vvv = '';
                    let $mmm = '';
                    let $ccc = '';
                    $.each(data, function (key, value) {
                        if (key === 'niveau') {
                            $elniv.val(value);
                        }
                        if (key === 'specialiteid') {
                            $vvv = value;
                            $elsp.val(value);
                        }

                        if (key === 'matiereid') {
                            $mmm = value;
                            $elmatiere.val(value);
                        }
                        if (key === 'classeid') {
                            $ccc = value;
                            $elclasse.val(value);
                        }
                        if (key === 'specialite') {
                            $('select.myspecialite-js option').remove();
                            // console.log(value)
                            $.each(value, function (key, val) {
                                $elsp.append($("<option></option>").attr("value", val).text(key));
                            });
                        }
                        if (key === 'matieres') {
                            $('select.mymatiere-js option').remove();
                            // console.log(value)
                            $.each(value, function (key, val) {
                                $elmatiere.append($("<option></option>").attr("value", val).text(key));
                            });
                        }
                        if (key === 'classes') {
                            $('select.myclasse-js option').remove();
                            // console.log(value)
                            $.each(value, function (key, val) {
                                $elclasse.append($("<option></option>").attr("value", val).text(key));
                            });
                        }
                    });
                    $elsp.val($vvv);
                    $elmatiere.val($mmm);
                    $elclasse.val($ccc);
                })
            }

            $(document).on('change', '.myniveau-js', function () {
                let $field = $(this)
                let data = {}

                $('select.myspecialite-js option').remove();
                data['niveau'] = $field.val()

                $.post('{{ path('getSpecialiteByNiveauAjax') }}', data).then(function (data) {

                    var $el = $("select.myspecialite-js");
                    // $el.empty(); // remove old options
                    $('select.myspecialite-js option:gt(0)').remove();
                    $.each(data, function (key, value) {
                        $el.append($("<option></option>").attr("value", value).text(key));
                    });
                    $el.trigger('change');
                })
            })

            $(document).on('change', '.myspecialite-js', function () {
                var $eld = $("select.myniveau-js");
                let $field = $(this)
                let data = {}

                data['niveau'] = $eld.val()
                data['specialite'] = $field.val()

                $.post('{{ path('getSpecialiteNiveauAjax') }}', data).then(function (data) {

                    var $ell = $("input.myspecialiteniveau-js");
                    $.each(data, function (key, value) {
                        $ell.attr("value", value).trigger('change');
                    });

                })
            })

            $(document).on('change', '.myspecialiteniveau-js', function () {
                let $field = $(this)
                let data = {}

                $('select.myclasse-js option').remove();
                $('select.mymatiere-js option').remove();
                data['specialiteniveau'] = $field.val();
                data['annee'] = $('select.myannee-js').val();
                data['periode'] = 1;

                // debugger
                $.post('{{ path('getClasseAndMatiereBySpecialiteNiveauAjax') }}', data).then(function (data) {

                    console.log(data)
                    var $elclasseee = $("select.myclasse-js");
                    var $elmatiereee = $("select.mymatiere-js");

                    $('select.myclasse-js option:gt(0)').remove();
                    $('select.mymatiere-js option:gt(0)').remove();

                    $.each(data, function (key, value) {
                        if (key === 'classes') {
                            $('select.myclasse-js option').remove();
                            // console.log(value)
                            $.each(value, function (key, val) {
                                $elclasseee.append($("<option></option>").attr("value", val).text(key));
                            });
                            $('select.myclasse-js').trigger('change');
                        }
                        if (key === 'matieres') {
                            $('select.mymatiere-js option').remove();
                            // console.log(value)
                            $.each(value, function (key, val) {
                                $elmatiereee.append($("<option></option>").attr("value", val).text(key));
                            });
                            $('select.mymatiere-js').trigger('change');

                        }
                    });
                    // $el.empty(); // remove old options
                    // $.each(data, function(key,value) {
                    //     $el.append($("<option></option>").attr("value", value).text(key)) ;
                    // });
                })
            });

        });

        var x = document.getElementsByClassName("myservice-js");

        // Array.from(document.getElementsByClassName(".myservice-js").rows).forEach((row) => {
        //     console.log(row);
        // });

        $(document).on('change', '.myservice-js', function () {
            let $field = $(this)
            let data = {}
            let date_deb
            // $field.parents('tr').eq(0).find('.myprix-js').val(data);
            // $field.parents('tr').eq(0).find('.prix-service-js').val(data);
            data['Service'] = $field.val();
            // data['Service'] = 1;
            console.log(data['Service'] )
            $.post('{{ path('getServicepricAjax') }}', data).then(function (data) {

                console.log(data)
                // var $elclasseee = $("select.myclasse-js");
                // var $elmatiereee = $("select.mymatiere-js");
                // document.getElementById("myprix-js").value = 66;
                // document.getElementById("myprix-js").value = 66;
                // document.getElementsByClassName(".myprix-js").value = 66;
                // // $(".myprix-js").val(0)=66;
                // // $('.myprix-js').remove();
                // $('.myprix-js').val(data);


                date_deb = data['date'];
                //  date_deb = date_deb.replace("  à", ",");
                //  date_deb = date_deb.replace("Jan", "janv.");
                //  date_deb = date_deb.replace("Feb", "févr.");
                //  date_deb = date_deb.replace("Mar", "mars");
                //  date_deb = date_deb.replace("Apr", "avr.");
                //  date_deb = date_deb.replace("May", "mai");
                //  date_deb = date_deb.replace("Jun", "juin");
                //  date_deb = date_deb.replace("Jul", "juil.");
                //  date_deb = date_deb.replace("Aug", "août");
                //  date_deb = date_deb.replace("Sep", "sept.");
                //  date_deb = date_deb.replace("Oct", "oct.");
                //  date_deb = date_deb.replace("Nov", "nov.");
                //  date_deb = date_deb.replace("Dec", "déc.");

                $field.parents('tr').eq(0).find('.date-js').val(date_deb);

                $field.parents('tr').eq(0).find('.myprix-js').val(data['price']);
                $field.parents('tr').eq(0).find('.prix-service-js').val(data['price']);



            })
        });

        $(document).on('change', '.myprix-js', function () {
            let $field = $(this)

            let data = {};
            let min = {};
            let ki = 0;
            let service = $(this).parents('tr').eq(0).find('.myservice-js').val();
            let montantfacturable = $(this).parents('tr').eq(0).find('.myprix-js').val();

            $field.parents('tr').eq(0).find('.myprix-du-js')[0].style.visibility = 'hidden';
            $field.parents('tr').eq(0).find('.myprix-payed-js')[0].style.visibility = 'hidden'
            $field.parents('tr').eq(0).find('.myprix-reste-js')[0].style.visibility = 'hidden';
            $field.parents('tr').eq(0).find('.myprix-acompte-js')[0].style.visibility = 'hidden';
            if(service){
                data['Service'] = service;
                // data['montantfacturable'] =  $('.myprix-js').val();
                data['montantfacturable'] =  montantfacturable;
                $.post('{{ path('getServiceEcheancePourcentageAjax') }}', data).then(function (data) {
                    $.each(data, function (key, value) {
                        if (key === 'echeances') {
                            $.each(value, function (key, val) {
                                if(data['montantfacturable']){

                                    if ( data['fix'] == 1){
                                        min[ki] = key;
                                        ki++;
                                        // location.href = $('.montant-avec-pourcentage-js-'+key);
                                        $('.montant-avec-pourcentage-js-'+key).val('');
                                        $('.montant-avec-pourcentage-js-'+key).attr('disabled',false);
                                        // console.log(data['min']);
                                        // $('.montant-avec-pourcentage-js-'+key).focus();

                                        // $('.montant-avec-pourcentage-js-'+key).val(parseFloat(val));
                                    }
                                    else {
                                        $('.montant-avec-pourcentage-js-'+key).val(parseFloat(val)*parseFloat(data['montantfacturable']/100));
                                    }
                                }

                                else {
                                    $('.montant-avec-pourcentage-js-'+key).val(0);
                                }

                                if ( data['fix'] == 1){
                                    $('.montant-avec-pourcentage-js-'+min[0]).focus();

                                }

                            });
                        }
                    });
                })
            }





            data['Service'] = service;
            data['ideleve'] =  $('.myideleve-js').val();
            console.log('totalpayedajaxavant')
            console.log(data)
            console.log('totalpayedajaxavant')
            // data['Service'] = 1;
            $.post('{{ path('getTotalpayedAjax') }}', data).then(function (data) {
                //
                console.log('totalpayedajax')
                console.log(data)
                console.log('totalpayedajax')
                // console.log(data)
                // console.log('fin')
                date_deb = data['date'];


                $field.parents('tr').eq(0).find('.date-js').val(date_deb);
                $field.parents('tr').eq(0).find('.myprix-payed-js').val(data['somme']);
                $field.parents('tr').eq(0).find('.myprix-du-js').val(data['montantavecpourcentage']);
                // if ((parseFloat(data['montantavecpourcentage']) - parseFloat(data['somme']) )<0 ){
                //
                //     $field.parents('tr').eq(0).find('.myprix-acompte-js').val(parseFloat(data['montantavecpourcentage']) - parseFloat(data['somme']));
                //     $field.parents('tr').eq(0).find('.myprix-reste-js').val(parseFloat(0));
                //
                // }
                // else {

                $field.parents('tr').eq(0).find('.myprix-reste-js').val(parseFloat(data['montantavecpourcentage']) - parseFloat(data['somme']));
                $field.parents('tr').eq(0).find('.myprix-acompte-js').val(parseFloat(data['montantavecpourcentage']) - parseFloat(data['somme']));


                {#}#}

                // $field.parents('tr').eq(0).find('.prix-service-js').val(data);



            })

        });

        $('.customFile').val('');
        $('.custom-file-input').val('');
        console.log("done");

        $(document).on('change', '.myservice-js', function () {
            let $field = $(this)
            let data = {}
            // $field.parents('tr').eq(0).find('.myprix-js').val(data);
            // $field.parents('tr').eq(0).find('.prix-service-js').val(data);






            // let service = $(this).parents('tr').eq(0).find('.myservice-js').val();
            let service = $field.val();
            if(service){
                data['Service'] = service;
                data['montantfacturable'] =  $('.myprix-js').val();
                $.post('{{ path('getServiceEcheancePourcentageAjax') }}', data).then(function (data) {

                    $.each(data, function (key, value) {
                        if (key === 'echeances') {
                            $.each(value, function (key, val) {
                                if(data['montantfacturable']){
                                    $('.montant-avec-pourcentage-js-'+key).val(parseFloat(val)*parseFloat(data['montantfacturable']/100));

                                } else {
                                    $('.montant-avec-pourcentage-js-'+key).val(0);
                                }
                            });
                        }
                    });
                })
            }







        });


    </script>
{% endblock %}

{% block stylesheets %}
    {{ parent() }}
    <style>

        .custom-row .col-lg-1,
        .custom-row .col-lg-10,
        .custom-row .col-lg-11,
        .custom-row .col-lg-12,
        .custom-row .col-lg-2,
        .custom-row .col-lg-3,
        .custom-row .col-lg-4,
        .custom-row .col-lg-5,
        .custom-row .col-lg-6,
        .custom-row .col-lg-7,
        .custom-row .col-lg-8,
        .custom-row .col-lg-9,
        .custom-row .col-md-1,
        .custom-row .col-md-10,
        .custom-row .col-md-11,
        .custom-row .col-md-12,
        .custom-row .col-md-2,
        .custom-row .col-md-3,
        .custom-row .col-md-4,
        .custom-row .col-md-5,
        .custom-row .col-md-6,
        .custom-row .col-md-7,
        .custom-row .col-md-8,
        .custom-row .col-md-9,
        .custom-row .col-sm-1,
        .custom-row .col-sm-10,
        .custom-row .col-sm-11,
        .custom-row .col-sm-12,
        .custom-row .col-sm-2,
        .custom-row .col-sm-3,
        .custom-row .col-sm-4,
        .custom-row .col-sm-5,
        .custom-row .col-sm-6,
        .custom-row .col-sm-7,
        .custom-row .col-sm-8,
        .custom-row .col-sm-9,
        .custom-row .col-xs-1,
        .custom-row .col-xs-10,
        .custom-row .col-xs-11,
        .custom-row .col-xs-12,
        .custom-row .col-xs-2,
        .custom-row .col-xs-3,
        .custom-row .col-xs-4,
        .custom-row .col-xs-5,
        .custom-row .col-xs-6,
        .custom-row .col-xs-7,
        .custom-row .col-xs-8,
        .custom-row .col-xs-9 {

            position: relative;
            min-height: 1px;
            padding-right: 5px;
            padding-left: 5px;

        }
        input[type="file"] {
            display: none;
        }
        .custom-file-upload {
            border-radius: 2px;
            box-shadow: 0 1px 5px 0 rgba(108, 144, 162, 0.4);
            border: 1px solid #bfc0c4;
            display: inline-block;
            padding: 6px 8px;
            margin: 0 5px;
            cursor: pointer;
        }
    </style>
{% endblock %}