79 lines
2.7 KiB
HTML
79 lines
2.7 KiB
HTML
{% extends "base.html" %}
|
|
{% block title %}Conversation #{{ chat_session.id }}{% endblock %}
|
|
|
|
{% block extra_css %}
|
|
<style>
|
|
.msg-bubble {
|
|
max-width: 80%;
|
|
padding: .6rem .9rem;
|
|
border-radius: 1rem;
|
|
font-size: .9rem;
|
|
line-height: 1.5;
|
|
white-space: pre-wrap;
|
|
word-break: break-word;
|
|
}
|
|
.msg-user { background:#0d6efd; color:#fff; border-bottom-right-radius:.25rem; align-self:flex-end; }
|
|
.msg-ai { background:#f8f9fa; border:1px solid #dee2e6; border-bottom-left-radius:.25rem; align-self:flex-start; }
|
|
.msg-row { display:flex; flex-direction:column; gap:.75rem; }
|
|
</style>
|
|
{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="mb-3">
|
|
{% if is_admin %}
|
|
<a href="{{ url_for('support.admin_conversations') }}" class="btn btn-sm btn-outline-secondary">
|
|
<i class="bi bi-arrow-left me-1"></i>All Conversations
|
|
</a>
|
|
{% else %}
|
|
<a href="{{ url_for('support.my_conversations') }}" class="btn btn-sm btn-outline-secondary">
|
|
<i class="bi bi-arrow-left me-1"></i>My Conversations
|
|
</a>
|
|
{% endif %}
|
|
</div>
|
|
|
|
<div class="row g-4">
|
|
<div class="col-lg-8">
|
|
<div class="card shadow-sm">
|
|
<div class="card-header d-flex justify-content-between align-items-center">
|
|
<strong>{{ chat_session.title or 'Conversation #' ~ chat_session.id }}</strong>
|
|
<small class="text-muted">{{ messages | length }} messages</small>
|
|
</div>
|
|
<div class="card-body">
|
|
{% if messages %}
|
|
<div class="msg-row">
|
|
{% for msg in messages %}
|
|
<div class="msg-bubble msg-{{ msg.role }}">
|
|
{{ msg.content }}
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
{% else %}
|
|
<div class="text-muted text-center py-3">No messages in this conversation.</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-lg-4">
|
|
<div class="card shadow-sm">
|
|
<div class="card-header"><i class="bi bi-info-circle me-2"></i>Details</div>
|
|
<div class="card-body small">
|
|
{% if is_admin and chat_session.customer %}
|
|
<p class="mb-1"><strong>Customer:</strong> {{ chat_session.customer.display_name }}</p>
|
|
<p class="mb-2 text-muted">{{ chat_session.customer.email }}</p>
|
|
<hr class="my-2">
|
|
{% endif %}
|
|
<p class="mb-1"><strong>Started:</strong> {{ chat_session.created_at.strftime('%b %d, %Y %I:%M %p') }}</p>
|
|
<p class="mb-2"><strong>Last message:</strong> {{ chat_session.last_msg_at.strftime('%b %d, %Y %I:%M %p') }}</p>
|
|
{% if not is_admin %}
|
|
<a href="{{ url_for('support.chat', session_id=chat_session.id) }}"
|
|
class="btn btn-primary btn-sm w-100 mt-2">
|
|
<i class="bi bi-chat me-1"></i>Continue This Chat
|
|
</a>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|