Enhance user identifier formatting and improve user organization display with titles

This commit is contained in:
Yaro Kasear 2025-07-28 08:32:01 -05:00
parent cd834e768d
commit 7594b66520
4 changed files with 62 additions and 26 deletions

View file

@ -33,7 +33,7 @@ class User(db.Model, ImageAttachable):
@property
def identifier(self) -> str:
return f"{self.first_name or ''} {self.last_name or ''}".strip()
return f"{self.first_name or ''} {self.last_name or ''}{', ' + (''.join(word[0].upper() for word in self.title.split())) if self.title else ''}".strip()
def __init__(self, first_name: Optional[str] = None, last_name: Optional[str] = None,
title: Optional[str] = None,location_id: Optional[int] = None,

View file

@ -72,7 +72,7 @@ def user(id):
@main.route("/user/<id>/org")
def user_org(id):
user = eager_load_user_relationships(db.session.query(User).filter(User.id == id)).first()
user = eager_load_user_relationships(db.session.query(User).filter(User.id == id).order_by(User.first_name, User.last_name)).first()
if not user:
return render_template('error.html', title='User Not Found', message=f'User with ID {id} not found.')
@ -81,7 +81,7 @@ def user_org(id):
while current_user:
subordinates = (
eager_load_user_relationships(
db.session.query(User).filter(User.supervisor_id == current_user.id)
db.session.query(User).filter(User.supervisor_id == current_user.id).order_by(User.first_name, User.last_name)
).all()
)
org_chart.insert(0, {

View file

@ -48,6 +48,14 @@
}
{% endset %}
{% set iconBar %}
{% if user.id != None %}
{{ buttons.render_button(
id = 'org_chart',
icon = 'diagram-3',
logic = "window.location.href = '" + url_for('main.user_org', id=user.id) + "';",
style = 'outline-secondary'
) }}
{% endif %}
<div class="btn-group">
{% if user.id != None %}
{{ buttons.render_button(

View file

@ -2,35 +2,63 @@
{% block content %}
{% for layer in org_chart %}
{# Only show the top-level user on the first iteration #}
{% 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="row align-items-center justify-content-center mb-3">
<div class="column text-center fw-bold">
{{ layer.user.identifier }}
<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 %}
{# Render this layer's subordinates #}
{% if layer['subordinates'] %}
<div class="row align-items-center justify-content-center mb-3 border">
{% set current_index = loop.index0 %}
{% set next_user = org_chart[current_index + 1].user if current_index + 1 < org_chart|length else None %}
{% for subordinate in layer.subordinates %}
<div class="col text-center {% if next_user and subordinate.id == next_user.id %}fw-bold{% endif %}">
{% if subordinate == user %}
{{ subordinate.identifier }}
{% else %}
<a class="link-success link-underline-opacity-0"
href="{{ url_for('main.user_org', id=subordinate.id) }}">
{{ subordinate.identifier }}
</a>
{% endif %}
</div>
{% endfor %}
{% 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 %}
{% endblock %}
{% block script %}
document.querySelectorAll('.highlighted-card').forEach(card => {
card.scrollIntoView({
behavior: "smooth",
block: "center",
inline: "center"
});
});
{% endblock %}