HH/templates/simulator/log_detail.html

325 lines
11 KiB
HTML

{% extends "layouts/base.html" %}
{% load i18n static %}
{% block title %}{% trans "HIS Log" %} #{{ log.request_id }} - PX360{% endblock %}
{% block extra_css %}
<style>
.channel-badge {
display: inline-block;
padding: 6px 16px;
border-radius: 12px;
font-size: 1rem;
font-weight: 500;
}
.channel-email { background: #e3f2fd; color: #1976d2; }
.channel-sms { background: #fff3e0; color: #f57c00; }
.channel-his_event { background: #e8f5e9; color: #388e3c; }
.status-badge {
display: inline-block;
padding: 6px 16px;
border-radius: 12px;
font-size: 1rem;
font-weight: 500;
}
.status-success, .status-sent { background: #d4edda; color: #155724; }
.status-failed { background: #f8d7da; color: #721c24; }
.status-partial { background: #fff3cd; color: #856404; }
.info-card {
background: white;
border-radius: 8px;
padding: 20px;
margin-bottom: 20px;
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}
.json-display {
background: #f5f5f5;
padding: 15px;
border-radius: 4px;
font-family: 'Courier New', monospace;
font-size: 0.85rem;
overflow-x: auto;
max-height: 400px;
}
.related-object {
background: #e7f3ff;
border-left: 4px solid #2196f3;
padding: 12px;
margin-bottom: 10px;
border-radius: 4px;
}
</style>
{% endblock %}
{% block content %}
<div class="container-fluid">
<div class="row mb-4">
<div class="col">
<h2>
<i class="fas fa-robot"></i> {% trans "HIS Log" %} #{{ log.request_id }}
</h2>
<p class="text-muted">{% trans "Request and response details" %}</p>
</div>
<div class="col-auto">
<a href="{% url 'simulator:logs_list' %}" class="btn btn-secondary">
<i class="fas fa-arrow-left"></i> {% trans "Back to Logs" %}
</a>
</div>
</div>
<!-- Basic Information -->
<div class="info-card">
<div class="row">
<div class="col-md-3">
<strong>{% trans "Channel" %}:</strong>
<br>
<span class="channel-badge channel-{{ log.channel }} mt-2">
{% if log.channel == 'email' %}📧 {% trans "Email" %}
{% elif log.channel == 'sms' %}📱 {% trans "SMS" %}
{% else %}🏥 {% trans "HIS Event" %}{% endif %}
</span>
</div>
<div class="col-md-3">
<strong>{% trans "Status" %}:</strong>
<br>
<span class="status-badge status-{{ log.status }} mt-2">
{{ log.get_status_display_with_icon }}
</span>
</div>
<div class="col-md-3">
<strong>{% trans "Timestamp" %}:</strong>
<br>
<span class="mt-2 d-block">{{ log.timestamp|date:"Y-m-d H:i:s" }}</span>
</div>
<div class="col-md-3">
<strong>{% trans "Processing Time" %}:</strong>
<br>
<span class="mt-2 d-block">
{% if log.processing_time_ms %}
{{ log.processing_time_ms }}ms
{% else %}
-
{% endif %}
</span>
</div>
</div>
{% if log.ip_address or log.user_agent %}
<hr>
<div class="row">
{% if log.ip_address %}
<div class="col-md-6">
<strong>{% trans "IP Address" %}:</strong>
<br>
<code>{{ log.ip_address }}</code>
</div>
{% endif %}
{% if log.user_agent %}
<div class="col-md-6">
<strong>{% trans "User Agent" %}:</strong>
<br>
<small>{{ log.user_agent|truncatechars:100 }}</small>
</div>
{% endif %}
</div>
{% endif %}
</div>
<!-- Related Objects -->
{% if related_objects %}
<div class="info-card">
<h5 class="mb-3"><i class="fas fa-link"></i> {% trans "Related Objects" %}</h5>
{% if related_objects.patient %}
<div class="related-object">
<strong><i class="fas fa-user"></i> {% trans "Patient" %}</strong>
<div class="mt-2">
<strong>{{ related_objects.patient.name }}</strong><br>
<small class="text-muted">MRN: {{ related_objects.patient.mrn }}</small><br>
<small class="text-muted">
<i class="fas fa-phone"></i> {{ related_objects.patient.phone }} |
<i class="fas fa-envelope"></i> {{ related_objects.patient.email }}
</small>
</div>
</div>
{% endif %}
{% if related_objects.journey %}
<div class="related-object">
<strong><i class="fas fa-route"></i> {% trans "Journey" %}</strong>
<div class="mt-2">
<strong>{{ related_objects.journey.encounter_id }}</strong><br>
<small class="text-muted">
{% trans "Type" %}: {{ related_objects.journey.journey_type }} |
{% trans "Status" %}: {{ related_objects.journey.status }}
</small><br>
<small class="text-muted">
<i class="fas fa-user"></i> {{ related_objects.journey.patient_name }}
</small>
</div>
</div>
{% endif %}
{% if related_objects.survey %}
<div class="related-object">
<strong><i class="fas fa-clipboard-list"></i> {% trans "Survey" %}</strong>
<div class="mt-2">
<strong>ID: {{ related_objects.survey.id }}</strong><br>
<small class="text-muted">
{% trans "Type" %}: {{ related_objects.survey.survey_type }} |
{% trans "Status" %}: {{ related_objects.survey.status }}
</small>
{% if related_objects.survey.total_score %}
<br>
<small class="text-muted">
<i class="fas fa-star"></i> {% trans "Score" %}: {{ related_objects.survey.total_score }}
</small>
{% endif %}
<br>
<small class="text-muted">
<i class="fas fa-user"></i> {{ related_objects.survey.patient_name }}
</small>
</div>
</div>
{% endif %}
</div>
{% endif %}
<!-- Channel-Specific Details -->
<div class="info-card">
<h5 class="mb-3"><i class="fas fa-info-circle"></i> {% trans "Request Details" %}</h5>
{% if log.recipient %}
<div class="row mb-3">
<div class="col-md-4">
<strong>{% trans "Recipient" %}:</strong>
<br>
<code>{{ log.recipient }}</code>
</div>
</div>
{% endif %}
{% if log.subject %}
<div class="row mb-3">
<div class="col-md-12">
<strong>{% trans "Subject" %}:</strong>
<br>
{{ log.subject }}
</div>
</div>
{% endif %}
{% if log.event_type %}
<div class="row mb-3">
<div class="col-md-4">
<strong>{% trans "Event Type" %}:</strong>
<br>
<code>{{ log.event_type }}</code>
</div>
{% if log.visit_type %}
<div class="col-md-4">
<strong>{% trans "Visit Type" %}:</strong>
<br>
<span class="badge badge-secondary">{{ log.visit_type|upper }}</span>
</div>
{% endif %}
{% if log.department %}
<div class="col-md-4">
<strong>{% trans "Department" %}:</strong>
<br>
{{ log.department }}
</div>
{% endif %}
</div>
{% endif %}
{% if log.hospital_code %}
<div class="row mb-3">
<div class="col-md-4">
<strong>{% trans "Hospital" %}:</strong>
<br>
<span class="badge badge-info">{{ log.hospital_code }}</span>
</div>
{% if log.patient_id %}
<div class="col-md-4">
<strong>{% trans "Patient MRN" %}:</strong>
<br>
<code>{{ log.patient_id }}</code>
</div>
{% endif %}
{% if log.journey_id %}
<div class="col-md-4">
<strong>{% trans "Journey ID" %}:</strong>
<br>
<code>{{ log.journey_id }}</code>
</div>
{% endif %}
</div>
{% endif %}
</div>
<!-- Request Payload -->
<div class="info-card">
<h5 class="mb-3">
<i class="fas fa-file-code"></i> {% trans "Request Payload" %}
<button class="btn btn-sm btn-outline-secondary float-end" onclick="copyToClipboard('payload-content')">
<i class="fas fa-copy"></i> {% trans "Copy" %}
</button>
</h5>
<div class="json-display" id="payload-content">{{ payload_formatted }}</div>
</div>
<!-- Response Data -->
{% if response_formatted %}
<div class="info-card">
<h5 class="mb-3">
<i class="fas fa-reply"></i> {% trans "Response Data" %}
<button class="btn btn-sm btn-outline-secondary float-end" onclick="copyToClipboard('response-content')">
<i class="fas fa-copy"></i> {% trans "Copy" %}
</button>
</h5>
<div class="json-display" id="response-content">{{ response_formatted }}</div>
</div>
{% endif %}
<!-- Error Message -->
{% if log.error_message %}
<div class="info-card" style="border-left: 4px solid #f44336;">
<h5 class="mb-3 text-danger">
<i class="fas fa-exclamation-triangle"></i> {% trans "Error Details" %}
</h5>
<pre class="text-danger">{{ log.error_message }}</pre>
</div>
{% endif %}
<!-- Message Preview -->
{% if log.message_preview %}
<div class="info-card">
<h5 class="mb-3">
<i class="fas fa-envelope"></i> {% trans "Message Preview" %}
</h5>
<div class="alert alert-info">
{{ log.message_preview }}
</div>
</div>
{% endif %}
</div>
<script>
function copyToClipboard(elementId) {
const text = document.getElementById(elementId).textContent;
navigator.clipboard.writeText(text).then(function() {
alert('Copied to clipboard!');
}, function(err) {
console.error('Failed to copy: ', err);
});
}
</script>
{% endblock %}