174 lines
8.5 KiB
HTML
174 lines
8.5 KiB
HTML
{% extends "portal_base.html" %}
|
|
{% load static i18n %}
|
|
|
|
{% block title %}{{ message.subject }}{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="container-fluid py-4">
|
|
<div class="row">
|
|
<div class="col-12">
|
|
<div class="card shadow-sm mb-4 border-0">
|
|
<div class="card-header bg-gradient border-0 pb-3">
|
|
<div class="d-flex justify-content-between align-items-start gap-3">
|
|
<div>
|
|
<h4 class="mb-2 fw-bold">{{ message.subject }}</h4>
|
|
{% if message.parent_message %}
|
|
<span class="badge bg-info">{% trans "Reply" %}</span>
|
|
{% endif %}
|
|
</div>
|
|
<div class="btn-group flex-wrap" role="group">
|
|
<a href="{% url 'message_reply' message.id %}" class="btn btn-sm btn-main-action">
|
|
<i class="fas fa-reply me-1"></i> {% trans "Reply" %}
|
|
</a>
|
|
{% if message.recipient == request.user %}
|
|
<button type="button" class="btn btn-sm btn-outline-warning"
|
|
hx-post="{% url 'message_mark_unread' message.id %}"
|
|
hx-swap="outerHTML">
|
|
<i class="fas fa-envelope me-1"></i> {% trans "Mark Unread" %}
|
|
</button>
|
|
{% endif %}
|
|
<button type="button" class="btn btn-sm btn-outline-danger"
|
|
hx-post="{% url 'message_delete' message.id %}"
|
|
hx-confirm="{% trans 'Are you sure you want to permanently delete this message? This action cannot be undone.' %}"
|
|
hx-redirect="{% url 'message_list' %}"
|
|
onclick="this.disabled=true;">
|
|
<i class="fas fa-trash me-1"></i> {% trans "Delete" %}
|
|
</button>
|
|
<a href="{% url 'message_list' %}" class="btn btn-sm btn-outline-secondary">
|
|
<i class="fas fa-arrow-left me-1"></i> {% trans "Back" %}
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="row g-4">
|
|
<div class="col-md-6">
|
|
<small class="text-muted d-block mb-1">{% trans "From:" %}</small>
|
|
<span class="fw-semibold">{{ message.sender.get_full_name|default:message.sender.username }}</span>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<small class="text-muted d-block mb-1">{% trans "To:" %}</small>
|
|
<span class="fw-semibold">{{ message.recipient.get_full_name|default:message.recipient.username }}</span>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<small class="text-muted d-block mb-1">{% trans "Type:" %}</small>
|
|
<span class="badge bg-primary-theme">
|
|
{{message.get_message_type_display}}
|
|
</span>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<small class="text-muted d-block mb-1">{% trans "Status:" %}</small>
|
|
{% if message.is_read %}
|
|
<span class="badge bg-success">{% trans "Read" %}</span>
|
|
{% if message.read_at %}
|
|
<small class="text-muted">({{ message.read_at|date:"M d, Y H:i" }})</small>
|
|
{% endif %}
|
|
{% else %}
|
|
<span class="badge bg-warning text-dark">{% trans "Unread" %}</span>
|
|
{% endif %}
|
|
</div>
|
|
<div class="col-md-6">
|
|
<small class="text-muted d-block mb-1">{% trans "Created:" %}</small>
|
|
<span>{{ message.created_at|date:"M d, Y H:i" }}</span>
|
|
</div>
|
|
{% if message.job %}
|
|
<div class="col-md-6">
|
|
<small class="text-muted d-block mb-1">{% trans "Related Job:" %}</small>
|
|
<a href="{% url 'job_detail' message.job.slug %}" class="fw-semibold text-decoration-none text-primary-theme">
|
|
{{ message.job.title }}
|
|
</a>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
{% if message.parent_message %}
|
|
<div class="alert alert-info mt-3 mb-0 border-0">
|
|
<strong>{% trans "In reply to:" %}</strong>
|
|
<a href="{% url 'message_detail' message.parent_message.id %}" class="text-decoration-none">
|
|
{{ message.parent_message.subject }}
|
|
</a>
|
|
<small class="text-muted d-block mt-2">
|
|
{% trans "From" %} {{ message.parent_message.sender.get_full_name|default:message.parent_message.sender.username }}
|
|
{% trans "on" %} {{ message.parent_message.created_at|date:"M d, Y H:i" }}
|
|
</small>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card shadow-sm border-0 mb-4">
|
|
<div class="card-body">
|
|
<div class="message-content">
|
|
{{ message.content|linebreaks }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{% if message.replies.all %}
|
|
<div class="card shadow-sm border-0">
|
|
<div class="card-header bg-light border-0">
|
|
<h6 class="mb-0">
|
|
<i class="fas fa-comments text-primary"></i> {% trans "Replies" %} <span class="badge bg-primary">{{ message.replies.count }}</span>
|
|
</h6>
|
|
</div>
|
|
<div class="card-body">
|
|
{% for reply in message.replies.all %}
|
|
<div class="message-reply mb-3 p-3 bg-light rounded">
|
|
<div class="d-flex justify-content-between align-items-start mb-2">
|
|
<div>
|
|
<strong>{{ reply.sender.get_full_name|default:reply.sender.username }}</strong>
|
|
<small class="text-muted ms-2">
|
|
{{ reply.created_at|date:"M d, Y H:i" }}
|
|
</small>
|
|
</div>
|
|
<span class="badge bg-{{ reply.message_type|lower }}">
|
|
{{ reply.get_message_type_display }}
|
|
</span>
|
|
</div>
|
|
<div class="reply-content mb-3">
|
|
{{ reply.content|linebreaks }}
|
|
</div>
|
|
<a href="{% url 'message_reply' reply.id %}" class="btn btn-sm btn-outline-primary">
|
|
<i class="fas fa-reply me-1"></i> {% trans "Reply" %}
|
|
</a>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|
|
|
|
{% block customCSS %}
|
|
<style>
|
|
.message-content {
|
|
white-space: pre-wrap;
|
|
word-wrap: break-word;
|
|
line-height: 1.6;
|
|
padding: 1.5rem;
|
|
background-color: #f8f9fa;
|
|
border-radius: 0.5rem;
|
|
border: 1px solid #e9ecef;
|
|
}
|
|
|
|
.reply-content {
|
|
white-space: pre-wrap;
|
|
word-wrap: break-word;
|
|
line-height: 1.5;
|
|
font-size: 0.95rem;
|
|
}
|
|
|
|
.message-reply:hover {
|
|
box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
|
|
}
|
|
|
|
.bg-gradient {
|
|
background: linear-gradient(135deg, #f5f7fa 0%, #ffffff 100%);
|
|
}
|
|
|
|
.btn-group .btn {
|
|
font-size: 0.875rem;
|
|
}
|
|
</style>
|
|
{% endblock %} |