{% extends 'admin_base.html.twig' %}


{% block body %}
    <div class="content-body">
        <!-- row -->
        <div class="container-fluid">

            <div class="row page-titles mx-0">
                <div class="col-sm-6 p-md-0">
                    <div class="welcome-text">
                        <h4>Les Utilisateurs</h4>
                    </div>
                </div>
                <div class="col-sm-6 p-md-0 justify-content-sm-end mt-2 mt-sm-0 d-flex">
                    <ol class="breadcrumb">
                        <li class="breadcrumb-item"><a href="{{ path("admin.main") }}">Tableau de board</a></li>
                        <li class="breadcrumb-item active"><a href="javascript:;">Modifier Utilisateur</a></li>
                    </ol>
                </div>
            </div>

            <div class="row">
                <div class="col-xl-12 col-xxl-12 col-sm-12">
                    <div class="card">
                        <div class="card-header">
                            <h5 class="card-title">Information personnelles</h5>
                        </div>
                        <div class="card-body">
                            <form action="{{ path("admin.users.update",{"token" : User.getSgToken()}) }}" method="post" enctype='multipart/form-data'>
                                <input type="hidden" name="_method" value="PUT" />

                                <div class="alert alert-custom alert-outline-danger fade show mb-5" role="alert" style=" display: {{ msg ? "block" : "none" }}">
                                    <div class="alert-icon"><i class="flaticon-warning"></i></div>
                                    <div class="alert-text">{{msg}} </div>
                                    <div class="alert-close">
                                        <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                                            <span aria-hidden="true"><i class="ki ki-close"></i></span>
                                        </button>
                                    </div>
                                </div>

                                <div class="row">
                                    <div class="col-lg-12 col-md-12 col-sm-12">
                                        <div class="form-group">
                                            <label class="form-label">Nom et Prénom</label>
                                            <input required type="text" placeholder="Nom Prénom" value="{{ User.getName()  }}" name="name" class="form-control">
                                            {% if errors %}
                                                {% for e in errors %}
                                                    {% if (e['propertyPath'] == "name")%}
                                                        <span class="form-text text-danger">{{ e['message'] }}</span>
                                                    {% endif %}
                                                {% endfor %}
                                            {% endif %}
                                        </div>
                                    </div>
                                    <div class="col-lg-12 col-md-12 col-sm-12">
                                        <div class="form-group">
                                            <label class="form-label">Email </label>
                                            <input required type="email" name="email" placeholder="aaa@gmail.com" value="{{ User.getEmail()  }}" class="form-control">
                                            {% if errors %}
                                                {% for e in errors %}
                                                    {% if (e['propertyPath'] == "email")%}
                                                        <span class="form-text text-danger">{{ e['message'] }}</span>
                                                    {% endif %}
                                                {% endfor %}
                                            {% endif %}
                                        </div>
                                    </div>
                                    <div class="col-lg-6 col-md-6 col-sm-12">

                                        <div class="form-group">
                                            <label class="form-label">Photo</label>
                                            <div class="input-group mb-3">

                                                <div class="custom-file">
                                                    <input type="file" name="profile_avatar" id="getval" onchange="previewFile()" accept=".png, .jpg, .jpeg" class="custom-file-input">
                                                    <label class="custom-file-label" id="img_text">Selectioner une Image</label>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-lg-6 col-md-6 col-sm-12">
                                        <img style="width: 200px;"  src="{{ User.file_name ? asset(user_images~'/'~User.id~'/'~User.file_name) : asset(admin_assets~"/images/default_image.png") }}" id="img">
                                    </div>
                                    <div class="col-lg-6 col-md-6 col-sm-12">
                                        <div class="form-group">
                                            <label class="form-label">Mot de passe</label>
                                            <input  type="password" id="myInput" name="password" placeholder="mot de passe" class="form-control">
                                            <div class="form-check">
                                                <input class="form-check-input" onclick="myFunction('myInput')" type="checkbox" >
                                                <label class="form-check-label">
                                                    Afficher Mot de Passe
                                                </label>
                                            </div>
                                            {% if errors %}
                                                {% for e in errors %}
                                                    {% if (e['propertyPath'] == "password")%}
                                                        <span class="form-text text-danger">{{ e['message'] }}</span>
                                                    {% endif %}
                                                {% endfor %}
                                            {% endif %}
                                        </div>
                                    </div>
                                    <div class="col-lg-6 col-md-6 col-sm-12">
                                        <div class="form-group">
                                            <label class="form-label">Confirmer le Mot de passe</label>
                                            <input  type="password" id="myInput2" name="password2" placeholder="mot de passe" class="form-control">
                                            <div class="form-check">
                                                <input class="form-check-input" onclick="myFunction('myInput2')" type="checkbox" >
                                                <label class="form-check-label">
                                                    Afficher Mot de Passe
                                                </label>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="col-lg-6 col-md-6 col-sm-12">
                                        <div class="form-group">
                                            <label class="form-label">Groups</label>
                                            <select required name="groups[]" class="form-control" multiple>
                                                {% for c in groups %}
                                                    <option {{ c in User.getGroups() ? "selected" :"" }} value="{{ c.getSgToken() }}">{{ c.getName() }}</option>
                                                {% endfor %}
                                            </select>
                                            {% if errors %}
                                                {% for e in errors %}
                                                    {% if (e['propertyPath'] == "groups")%}
                                                        <span class="form-text text-danger">{{ e['message'] }}</span>
                                                    {% endif %}
                                                {% endfor %}
                                            {% endif %}
                                        </div>
                                    </div>
                                    <div class="col-lg-3 col-md-6 col-sm-12">
                                        <div class="form-group">
                                            <label class="form-label">Role</label>
                                            <div class="col-sm-10">
                                                <div class="form-check">
                                                    <input class="form-check-input" type="radio" value="0" name="is_admin" {{ User.IsAdmin() ? "" :"checked" }}>
                                                    <label class="form-check-label">
                                                        Utilisateur
                                                    </label>
                                                </div>
                                                <div class="form-check">
                                                    <input class="form-check-input" type="radio" Value="1" name="is_admin" {{ User.IsAdmin() ? "checked" :"" }} >
                                                    <label class="form-check-label">
                                                        Administrateur
                                                    </label>
                                                </div>

                                            </div>
                                            {% if errors %}
                                                {% for e in errors %}
                                                    {% if (e['propertyPath'] == "is_admin")%}
                                                        <span class="form-text text-danger">{{ e['message'] }}</span>
                                                    {% endif %}
                                                {% endfor %}
                                            {% endif %}
                                        </div>
                                    </div>

                                    <div class="col-lg-3 col-md-6 col-sm-12">
                                        <div class="form-group">
                                            <div class="form-check">
                                                <input type="HIDDEN" name="active" id="active" value={{ User.isEnabled() ? "1" : "0" }} >
                                                <input class="form-check-input" onclick="f()"  type="checkbox" {{ User.isEnabled() ? "checked" :"" }}>
                                                <label class="form-check-label">
                                                    Active
                                                </label>
                                            </div>
                                        </div>
                                    </div>



                                    <div class="col-lg-12 col-md-12 col-sm-12">
                                        <button type="submit" class="btn btn-primary">Enregistrer</button>
                                        <button type="reset" class="btn btn-light">Annuler</button>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script type="text/javascript">


        function previewFile() {
            var preview = document.getElementById("img");
            var preview1 = document.getElementById("img_text");
            var file    = document.getElementById("getval").files[0];
            var reader  = new FileReader();

            reader.onloadend = function () {
                preview.src = reader.result;
                preview1.innerHTML=file.name;
            }

            if (file) {
                reader.readAsDataURL(file);
            } else {
                preview.src = "";
                preview.innerHTML="Selctioner une Image";
            }
        }




    </script>
{% endblock %}