{% trans_default_domain 'FOSUserBundle' %}

    <!-- start: PAGE TITLE -->
    <section id="page-title">
        <div class="row">
            <div class="col-sm-8">
                <h1 class="mainTitle">Mon Profile</h1>
                <span class="mainDescription">

                </span>
            </div>
            <ol class="breadcrumb">
                <li>
                    <span>Mon Compte</span>
                </li>
                <li class="active">
                    <span>Profile</span>
                </li>
            </ol>
        </div>
    </section>
    <!-- end: PAGE TITLE -->
    <!-- start: USER PROFILE -->
    <div class="container-fluid container-fullw bg-white">
        <div class="row">
            <div class="col-md-12">
                <div class="tabbable">
                    <div class="tab-content">
                        <div id="panel_overview" class="tab-pane fade in active">
                            <div class="row">
                                <div class="col-sm-5 col-md-4">
                                    <div class="user-left">
                                        <div class="center">
                                            <h4>{{user.civility ~'. '~user.nom~' '~user.prenom }}</h4>
                                            <div class="fileinput fileinput-new" data-provides="fileinput">
                                                <div class="user-image">
                                                    <div class="fileinput-new thumbnail">
                                                        {% if app.user.path is empty %}
                                                            <img src="{{ asset('uploads/picture/commun/Avatar.png')}}" alt="Admin Total">
                                                        {% else %}
                                                            <img  src="{{ asset('uploads/picture/' ~ app.user.path) }}" alt="Admin Total">
                                                        {% endif %}
                                                    </div>

                                                </div>
                                            </div>

                                            <hr>
                                            <div class="social-icons block">
                                                <ul>
                                                    <li data-placement="top" data-original-title="Twitter" class="social-twitter tooltips">
                                                        <a href="https://twitter.com/total?lang=fr" target="_blank">
                                                            Twitter
                                                        </a>
                                                    </li>
                                                    <li data-placement="top" data-original-title="Facebook" class="social-facebook tooltips">
                                                        <a href="https://www.facebook.com/TotalTunisie" target="_blank">
                                                            Facebook
                                                        </a>
                                                    </li>
                                                    <li data-placement="top" data-original-title="Google" class="social-youtube tooltips">
                                                        <a href="https://www.youtube.com/user/Total" target="_blank">
                                                           Youtube
                                                        </a>
                                                    </li>
                                                    <li data-placement="top" data-original-title="LinkedIn" class="social-linkedin tooltips">
                                                        <a href="https://www.linkedin.com/company-beta/1818/" target="_blank">
                                                            LinkedIn
                                                        </a>
                                                    </li>

                                                </ul>
                                            </div>
                                            <hr>
                                            <ul class="list-group">
                                                <li class="list-group-item">
                                                    <a href="{{ path('fos_user_profile_edit') }}"> Edit Profile </a>
                                                </li>
                                                <li class="list-group-item">
                                                    <a href="{{ path('fos_user_change_password') }}"> Changer mot de passe </a>
                                                </li>
                                                <li class="list-group-item">
                                                    <a href="{{ path('fos_user_security_logout') }}"> Déconnexion </a>
                                                </li>
                                            </ul>
                                            <hr>
                                        </div>

                                    </div>

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

                                    <div class="panel" id="contactInfo">

                                        <div collapse="contactInfo" ng-init="activities=false" class="panel-wrapper">
                                            <div class="panel-body">
                                                <table class="table table-condensed">
                                                    <thead>
                                                    <tr>
                                                        <th colspan="2">Contact Informations </th>
                                                        {#<th colspan="1"><a href="{{ path('fos_user_profile_edit') }}" class="show-tab"><i class="fa fa-pencil edit-user-info"></i></a></th>#}
                                                    </tr>
                                                    </thead>
                                                    <tbody>
                                                    <tr>
                                                        <td>Nom & Prénom:</td>
                                                        <td> {{ user.civility ~' '~user.nom ~' '~user.prenom }} </td><td></td>
                                                    </tr>
                                                    <tr>
                                                        <td>E-mail:</td>
                                                        <td>{{ user.email }} </td><td></td>
                                                    </tr>
                                                    <tr>
                                                        <td>Function:</td>
                                                        <td>{{ user.metier }}</td><td></td>
                                                    </tr>
                                                    {% if user.site is not null %}
                                                        <tr>
                                                            <td>Filiale:</td>
                                                            <td>{{ user.site.pays }}</td><td></td>
                                                        </tr>
                                                        <tr>
                                                            <td>Entite:</td>
                                                            <td>{{ user.site }}</td><td></td>
                                                        </tr>
                                                    {% endif %}
                                                    </tbody>
                                                </table>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="panel" id="Info">

                                        <div collapse="Info" ng-init="activities=false" class="panel-wrapper">
                                            <div class="panel-body">
                                                <table class="table table-condensed">
                                                    <thead>
                                                    <tr>
                                                        <th colspan="2">Autres Informations </th>
                                                    </tr>
                                                    </thead>
                                                    <tbody>
                                                    <tr>
                                                        <td>Login:</td>
                                                        <td>{{ user.username}}</td><td></td>
                                                    </tr>
                                                    <tr>
                                                        <td>Etat:</td>
                                                        <td>{% if user.enabled %} <span class="label label-success"> Active</span> {% else %} <span class="label label-danger"> Inactive</span>{% endif %}</td><td></td>
                                                    </tr>
                                                    <tr>
                                                        <td>Date de dernière connexion:</td>
                                                        <td>{{ user.lastlogin |date("d/m/Y H:i:s", "Europe/Paris")}} </td><td></td>
                                                    </tr>
                                                   </tbody>
                                                </table>
                                            </div>
                                        </div>
                                    </div>
                                    </div>
                            </div>
                        </div>
                        </div>
                </div>
            </div>
        </div>
    </div>