Easy_solution/templates/elements/userOrganizationInformation...

85 lines
3.7 KiB
Twig

{% block body %}
<div class="card col-4 mt-3 me-3" >
<div class="card-title shadow-sm p-3 d-flex justify-content-between align-items-center">
{# Affichage du nom de l'organisation et de l'icône de flèche #}
<div class="d-flex user-org-card"
style="cursor:pointer;" data-bs-toggle="collapse"
data-bs-target="#org-details-{{ organization.id }}" aria-expanded="false"
aria-controls="org-details-{{ organization.id }}">
<h2 class=" pe-2">{{ organization.name|capitalize }}</h2>
<i class="pt-2" id="arrow-icon-{{ organization.id }}">
{{ ux_icon('fa6-regular:circle-down', {height: '25px', width: '25px'}) }}
</i>
</div>
{% if is_granted("ROLE_ADMIN") %}
<a href="{{ path('user_organization_edit', {'id': uoId}) }}" class="btn btn-primary" >Modifier</a>
{% endif %}
</div>
{# Information principale sur l'utilisateur dans l'organisation#}
<div class="card-body">
{# Affichage du plus haut role #}
<p><b>Role:</b>
{% if roles|length > 0 %}
{% set firstRole = roles[0] %}
{% if firstRole.name == "SUPER ADMIN" or firstRole.name == "ADMIN" %}
<span class="badge bg-danger">{{ firstRole.name|capitalize }}</span>
{% else %}
<span class="badge bg-primary">{{ firstRole.name|capitalize }}</span>
{% endif %}
{% else %}
Aucun rôle
{% endif %}
</p>
{# Affichage des applications dont l'utilisateur à accès #}
<div class="d-flex">
{% if apps is not empty %}
{% for app in apps %}
<img src="{{ asset(app.logoUrl) }}" alt="Logo {{ app.name }}" class="img-fluid ms-2" style="height: 30px; width: 30px;">
{% endfor %}
{% else %}
Aucune application associée.
{% endif %}
</div>
</div>
{# Détails supplémentaires sur l'organisation #}
<div class="collapse card-body border-top" id="org-details-{{ organization.id }}">
{% if roles|length > 1 %}
<p><b>Autres rôles:</b>
{% for role in roles|slice(1) %}
{% if role.name == "SUPER ADMIN" or role.name == "ADMIN" %}
<span class="badge bg-danger">{{ role.name|capitalize }}</span>
{% else %}
<span class="badge bg-primary">{{ role.name|capitalize }}</span>
{% endif %}
{% if not loop.last %} - {% endif %}
{% endfor %}
</p>
{% endif %}
<p><b>Membre depuis:</b> {{ organization.createdAt|date('d/m/Y') }}</p>
</div>
</div>
{% endblock %}
{% block javascript %}
<script>
document.addEventListener('DOMContentLoaded', function() {
var collapseEl = document.getElementById('org-details-{{ organization.id }}');
var arrowEl = document.getElementById('arrow-icon-{{ organization.id }}');
if (collapseEl && arrowEl) {
collapseEl.addEventListener('show.bs.collapse', function () {
arrowEl.innerHTML = `{{ ux_icon('fa6-regular:circle-up', {height: '25px', width: '25px'})|e('js') }}`;
});
collapseEl.addEventListener('hide.bs.collapse', function () {
arrowEl.innerHTML = `{{ ux_icon('fa6-regular:circle-down', {height: '25px', width: '25px'})|e('js') }}`;
});
}
});
</script>
{% endblock %}