64 lines
2.6 KiB
HTML
64 lines
2.6 KiB
HTML
{% extends 'layout.html' %}
|
|
|
|
{% block content %}
|
|
{% for layer in org_chart %}
|
|
{% set current_index = loop.index0 %}
|
|
{% set next_user = org_chart[current_index + 1].user if current_index + 1 < org_chart|length else None %}
|
|
|
|
{% if loop.first %}
|
|
<div class="d-flex mb-5 justify-content-center">
|
|
<div class="card border border-primary border-2" style="width: 15rem;">
|
|
<div class="card-body">
|
|
<h5 class="card-title text-center">
|
|
{{ layer.user.first_name }} {{ layer.user.last_name }}<br />{{ links.entry_link('user', layer.user.id) }}
|
|
</h5>
|
|
<div class="card-text text-center">
|
|
{% if layer.user.title %}
|
|
({{ layer.user.title }})
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
|
|
{% if layer.subordinates %}
|
|
<div class="mb-5 px-3">
|
|
<div class="org-row d-grid gap-3" style="grid-auto-flow: column; overflow-x: auto; max-width: 100%;">
|
|
{% for subordinate in layer.subordinates %}
|
|
<div class="card {% if next_user and subordinate.id == next_user.id %}border border-primary border-2 highlighted-card{% endif %}" style="min-width: 15rem;">
|
|
<div class="card-body">
|
|
<h5 class="card-title text-center">
|
|
{% if subordinate == user %}
|
|
{{ subordinate.first_name }} {{ subordinate.last_name }}
|
|
{% else %}
|
|
<a class="link-success link-underline-opacity-0"
|
|
href="{{ url_for('main.user_org', id=subordinate.id) }}">
|
|
{{ subordinate.first_name }} {{ subordinate.last_name }}
|
|
</a>
|
|
{% endif %}
|
|
</h5>
|
|
<div class="card-text text-center">
|
|
{% if subordinate.title %}
|
|
({{ subordinate.title }})<br />
|
|
{% endif %}
|
|
{{ links.entry_link('user', subordinate.id) }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
{% endfor %}
|
|
{% endblock %}
|
|
|
|
{% block script %}
|
|
document.querySelectorAll('.highlighted-card').forEach(card => {
|
|
card.scrollIntoView({
|
|
behavior: "smooth",
|
|
block: "center",
|
|
inline: "center"
|
|
});
|
|
});
|
|
{% endblock %}
|