22 lines
1.5 KiB
HTML
22 lines
1.5 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh-CN">
|
|
<body style="font-family: -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; color: #4e5969; background-color: #f2f3f5; margin: 0; padding: 20px;">
|
|
<div style="max-width: 800px; margin: 0 auto;">
|
|
{% for conversation in conversations %}
|
|
<div style="background-color: white; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); border-radius: 12px; margin-bottom: 20px; padding: 16px;">
|
|
<div style="color: #86909c; border-bottom: 1px solid #e5e6eb; margin-bottom: 12px; padding-bottom: 8px;">会话开始时间：{{ conversation.started_at }}</div>
|
|
<div style="display: flex; flex-direction: column; gap: 12px;">
|
|
{% for message in conversation.messages %}
|
|
<div style="max-width: 75%; padding: 10px 14px; border-radius: 18px; line-height: 1.4; position: relative; word-wrap: break-word; {% if message.sender_type == 'customer' %}background-color: #94BFFF; border-top-right-radius: 4px; margin-left: 25%; align-self: flex-end;{% else %}background-color: white; border: 1px solid #e5e6eb; border-top-left-radius: 4px; margin-right: 25%; align-self: flex-start;{% endif %}">
|
|
<div style="font-size: 12px; color: #86909c; margin-bottom: 4px; {% if message.sender_type == 'customer' %}text-align: right;{% else %}text-align: left;{% endif %}">{{ message.sender }}</div>
|
|
<div>
|
|
{{ message.content }}
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
</body>
|
|
</html> |