111 lines
4.6 KiB
HTML
111 lines
4.6 KiB
HTML
{% extends "base.html" %}
|
|
{% load i18n %}
|
|
{% load static %}
|
|
|
|
{% block head %}
|
|
<style>
|
|
.discussion-item {
|
|
transition: background 0.15s;
|
|
border-left: 4px solid transparent;
|
|
}
|
|
.discussion-item.has-unread {
|
|
background-color: #f0f4ff;
|
|
border-left-color: var(--brand-color, #2f3e8b);
|
|
}
|
|
.discussion-item:hover {
|
|
background-color: #e8edf8;
|
|
text-decoration: none;
|
|
}
|
|
.avatar-sm {
|
|
width: 36px;
|
|
height: 36px;
|
|
font-size: 0.85rem;
|
|
border-radius: 50%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
flex-shrink: 0;
|
|
}
|
|
</style>
|
|
{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="container-fluid py-4">
|
|
|
|
<div class="d-flex justify-content-between align-items-center mb-4">
|
|
<h1 class="h3 mb-0">
|
|
<i class="bi bi-chat-dots me-2 text-primary"></i>{% translate "Discussions" %}
|
|
</h1>
|
|
<a href="{% url 'notifications:inbox' %}" class="btn btn-outline-secondary">
|
|
<i class="bi bi-bell me-1"></i>{% translate "Notifications" %}
|
|
</a>
|
|
</div>
|
|
|
|
{% if not items %}
|
|
<div class="card shadow-sm">
|
|
<div class="card-body text-center py-5 text-muted">
|
|
<i class="bi bi-chat-square fs-1 d-block mb-3"></i>
|
|
<p class="mb-0">{% translate "Vous n'avez encore aucune discussion." %}</p>
|
|
</div>
|
|
</div>
|
|
{% else %}
|
|
<div class="card shadow-sm">
|
|
<div class="list-group list-group-flush">
|
|
{% for item in items %}
|
|
<a href="{% url 'notifications:discussion_detail' item.discussion.pk %}"
|
|
class="list-group-item list-group-item-action discussion-item px-4 py-3 {% if item.unread_count %}has-unread{% endif %}">
|
|
<div class="d-flex align-items-start gap-3">
|
|
<!-- Icône -->
|
|
<div class="avatar-sm bg-primary text-white">
|
|
<i class="bi bi-chat-dots"></i>
|
|
</div>
|
|
|
|
<!-- Contenu -->
|
|
<div class="flex-grow-1 min-width-0">
|
|
<div class="d-flex justify-content-between align-items-start">
|
|
<div>
|
|
<span class="fw-semibold">{{ item.discussion.title|default:item.discussion }}</span>
|
|
{% if item.discussion.object_label %}
|
|
<span class="badge bg-light text-secondary ms-2 small">
|
|
<i class="bi bi-link-45deg me-1"></i>{{ item.discussion.object_label }}
|
|
</span>
|
|
{% endif %}
|
|
</div>
|
|
<span class="text-muted small ms-3 text-nowrap">
|
|
{{ item.discussion.updated_at|date:"d/m/Y H:i" }}
|
|
</span>
|
|
</div>
|
|
{% if item.last_message %}
|
|
<p class="mb-1 small text-muted text-truncate mt-1" style="max-width:600px;">
|
|
<strong>{{ item.last_message.author.get_full_name|default:item.last_message.author.username }}</strong> :
|
|
{{ item.last_message.content|truncatechars:120 }}
|
|
</p>
|
|
{% else %}
|
|
<p class="mb-1 small text-muted mt-1">{% translate "Aucun message encore." %}</p>
|
|
{% endif %}
|
|
<!-- Participants -->
|
|
<div class="d-flex align-items-center gap-1 mt-1">
|
|
{% for p in item.discussion.participants.all|slice:":6" %}
|
|
<span class="badge bg-secondary" title="{{ p.get_full_name|default:p.username }}">
|
|
{{ p.get_full_name|default:p.username|truncatechars:12 }}
|
|
</span>
|
|
{% endfor %}
|
|
{% if item.discussion.participants.count > 6 %}
|
|
<span class="badge bg-light text-muted">+{{ item.discussion.participants.count|add:"-6" }}</span>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Badge non-lus -->
|
|
{% if item.unread_count %}
|
|
<span class="badge bg-primary rounded-pill align-self-center">{{ item.unread_count }}</span>
|
|
{% endif %}
|
|
</div>
|
|
</a>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
|
|
</div>
|
|
{% endblock content %}
|