{% extends 'permission_index.html' %}
{% block content %}

            <div class="col-10">
                {% include 'include/_editor_toolbar.html' %}
                <div class="row mt-4">
                    <div class="col-5">
                        <div class="form-group row">
                            <label for="inputName" class="col-sm-2 col-form-label">Фамилия</label>
                            <div class="col-sm-10">
                                <input class="form-control" id="inputName" disabled value="{{ user_item.first_name }}">
                            </div>
                        </div>
                        <div class="form-group row">
                            <label for="inputLastName" class="col-sm-2 col-form-label">Имя</label>
                            <div class="col-sm-10">
                                <input class="form-control" id="inputLastName" disabled
                                       value="{{ user_item.last_name }}">
                            </div>
                        </div>
                        <div class="form-group row">
                            <label for="inputUsername" class="col-sm-2 col-form-label">Логин</label>
                            <div class="col-sm-10">
                                <input class="form-control" id="inputUsername" disabled
                                       value="{{ user_item.username }}">
                            </div>
                        </div>
                        <div class="form-group row">
                            <label for="inputService" class="col-sm-2 col-form-label">Служебный</label>
                            <div class="col-sm-10 mt-1">
                                <input class="" id="inputService" type="checkbox" disabled
                                       value="{{ user_item.is_service }}"  {% if user_item.is_service %} checked {% endif %}>
                            </div>
                        </div>
                        {% if user_item.is_service %}
                            <div class="form-group row">
                                <label for="inputUsername" class="col-sm-2 col-form-label">Проект</label>
                                <div class="col-sm-10">
                                    <input class="form-control" id="inputUsername" disabled
                                           value="{{ user_item.project }}" >
                                </div>
                            </div>
                        {% endif %}
                        {% if user_roles %}
                            <div class="form-group row">
                                <label for="inputName" class="col-sm-2 col-form-label">Роли:</label>
                                <div class="col-sm-10">
                                    {#                            <ul class="list-group">#}
                                    <div class="nav flex-column nav-pills" id="v-pills-tab" role="tablist"
                                         aria-orientation="vertical">
                                        {% for us in user_roles %}
                                            <a class="nav-link" id="v-{{ us.role.id }}-tab" data-toggle="pill"
                                               href="#v-{{ us.role.id }}" role="tab" aria-controls="v-{{ us.role.id }}"
                                               aria-selected="true">{{ us.role }}</a>
                                            {#                                    <li class="list-group-item">{{ us.role }}</li>#}
                                        {% endfor %}
                                        {#                            </ul>#}
                                    </div>
                                </div>

                            </div>
                        {% endif %}
                    </div>
                    <div class="col-5">
                        {% if user_roles %}
                            <div class="form-group row">
                                <label for="inputName" class="col-form-label">Ограничения:</label>
                                <div class="col-sm-10">
                                    <div class="tab-content" id="v-pills-tabContent">
                                        {% for k, rp in role_permissions.items %}
                                            <div class="tab-pane fade" id="v-{{ k }}" role="tabpanel"
                                                 aria-labelledby="v-{{ k }}-tab">
                                                {% if rp %}
                                                    <select class="form-control" multiple readonly="">
                                                        {% for perm in rp %}
                                                            <option value="{{ perm.id }}">{{ perm.code }}</option>
                                                        {% endfor %}
                                                    </select>
                                                {% endif %}
                                            </div>
                                        {% endfor %}
                                    </div>
                                    {#                            </ul>#}
                                </div>
                            </div>
                        {% endif %}
                    </div>
                </div>
            </div>
{% endblock %}