{% extends 'Backoffice/base.html.twig' %}

{% block activeLiMembreBureau %}class="active"{% endblock %}
{% block activeMembreBureau %}class="active"{% endblock %}
{% block body %}
    <section class="vbox">
        <section class="scrollable padder">
            <ul class="breadcrumb no-border no-radius b-b b-light pull-in">
                <li><a href=""><i class="fa fa-home"></i> Tableau de board</a></li>
                <li><a href="#">Membres de bureau</a></li>
                <li class="active">Nouveau membre de bureau</li>
            </ul>
            <div class="m-b-md">
                <h3 class="m-b-none">Membres de bureau</h3>
            </div>
            {% if response != "" %}
                {% if response == "OK" %}
                    <div class="alert alert-success">
                        <button type="button" class="close" data-dismiss="alert">&times;</button>
                        <i class="fa fa-ok-sign"></i><strong>OK !</strong> Membre ajouté avec succès</a>.
                    </div>
                {% else %}
                    <div class="alert alert-danger">
                        <button type="button" class="close" data-dismiss="alert">&times;</button>
                        <i class="fa fa-ban-circle"></i><strong>Erreur !</strong> {{ response }}
                    </div>
                {% endif %}
            {% endif %}
            <form method="POST" enctype="multipart/form-data">
                <div class="row">
                    <div class="col-sm-12">
                        <section class="panel panel-default">
                            <header class="panel-heading font-bold">Informations membre</header>
                            <div class="panel-body">
                                <div class="row">
                                    <div class="col-lg-6">
                                        <label>Chambre :</label>
                                        <select name="chambre" class="form-control">                                         
                                                <option value="MED">CHAMBRE DES PÊCHES MARITIMES DE LA MÉDITÉRRANÉE</option>        
                                                <option value="NORD">CHAMBRE DES PÊCHES MARITIMES DE L'ATLANTIQUE-NORD</option>   
                                                <option value="CENTRE">CHAMBRE DES PÊCHES MARITIMES DE L'ATLANTIQUE-CENTRE</option>   
                                                <option value="SUD">CHAMBRE DES PÊCHES MARITIMES DE L'ATLANTIQUE-SUD</option>                                 
                                        </select>
                                    </div>
                                    <div class="col-lg-6">
                                        <div class="form-group">
                                            <label>Civilité :</label>
                                            <select name="civilite" class="form-control">
                                                <option value="Mr.">Mr.</option>
                                                <option value="Mme.">Mme.</option>
                                            </select>
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    
                                    <div class="col-lg-6">
                                        <div class="form-group">
                                            <label>Nom</label>
                                            <input type="text" class="form-control" placeholder="Nom" name="nom"  value="{{ nom }}">
                                        </div>
                                    </div>
                                     <div class="col-lg-6">
                                        <div class="form-group">
                                            <label>Prenom</label>
                                            <input type="text" class="form-control" placeholder="Prenom" name="prenom" value="{{ prenom }}">
                                        </div>
                                    </div>
                                </div>
                                <div class="row" style='direction:rtl'>
                                    <div class="col-lg-6">
                                        <div class="form-group">
                                            <label>الاسم العائلي</label>
                                            <input type="text" class="form-control" placeholder="الاسم العائلي" name="nomAr"  value="{{ nomAr }}">
                                        </div>
                                    </div>
                                     <div class="col-lg-6">
                                        <div class="form-group">
                                            <label>الاسم الشخصي</label>
                                            <input type="text" class="form-control" placeholder="الاسم الشخصي" name="prenomAr" value="{{ prenomAr }}">
                                        </div>
                                    </div>
                                    
                                   
                                </div>
                                <div class="row">
                                    <div class="col-lg-6">
                                        <div class="form-group">
                                            <label>Téléphone</label>
                                            <input type="text" class="form-control" placeholder="Téléphone" name="tel" value="{{ tel }}">
                                        </div>
                                    </div>
                                    <div class="col-lg-6">
                                        <div class="form-group">
                                            <label>Cin</label>
                                            <input type="text" class="form-control" placeholder="Cin" name="cin" value="{{ cin }}">
                                        </div>
                                    </div>
                                </div>

                                <div class="row">
                                    <div class="col-lg-12">
                                        <div class="form-group">
                                            <label>Image :</label>
                                            <input id="file-fr" name="file[]" type="file" class="form-control">
                                        </div>
                                    </div>
                                </div>


                                <div class="row">
                                    <div class="col-lg-6">
                                        <div class="form-group">
                                            <input type='checkbox' id='ifMme' name="ifMme" value="1" onclick="check()">
                                            <label>Membre de bureau:</label>
                                        </div>
                                    </div>
                                </div>

                                <div class="row">
                                    <div class="col-lg-6">
                                        <div class="form-group" id='role' style='display:none'>
                                            <label>poste :</label>
                                            <select name="poste" class="form-control">
                                                <option value="1">Présidant</option>
                                                <option value="21">1ère Vice-Présidant</option>
                                                <option value="22">2ème Vice-Présidant</option>
                                                <option value="23">3ème Vice-Présidant</option>
                                                <option value="24">4ème Vice-Présidant</option>
                                                <option value="3">Assesseur</option>
                                                <option value="4">Trésorier</option>
                                                <option value="5">Trésorier Adjoint</option>
                                                <option value="6">Secrétaire</option>
                                                <option value="7">Secrétaire Adjoint</option>
                                            </select>
                                        </div>
                                    </div>

                                </div>

                            </div>
                        </section>
                    </div>
                </div>
                <div class="row">
                    <div class="col-sm-12">
                        <section class="panel panel-default">
                            <!--<header class="panel-heading font-bold">Droits d'accès</header>
                            <div class="panel-body">

                            </div>-->
                            <br/><br/>
                            <div class="text-center" style="margin-bottom: 50px;">
                                <button type="submit" class="btn btn-sm btn-primary ">Enregister le membre</button>
                            </div>
                            <br/>
                        </section>
                    </div>
                </div>
            </form>
        </section>
    </section>
    <br/><br/>
{% endblock %}
{% block js %}

 <script type="text/javascript">

       
       

function check(){
    var remember = document.getElementById('ifMme');
    if (remember.checked){
    var role = document.getElementById('role');
    role.setAttribute('style','display:block');
    }else{
    var role = document.getElementById('role');
    role.setAttribute('style','display:none');
    }
}

    </script>
{% endblock %}