agdar/core/templates/clinic/consent_detail.html
Marwan Alwali a788c086ae update
2025-11-02 18:05:50 +03:00

266 lines
10 KiB
HTML

{% extends "base.html" %}
{% load i18n static %}
{% block title %}{% trans "Consent Details" %} - {{ block.super }}{% endblock %}
{% block css %}
<style>
.consent-detail-container {
padding: 1rem;
}
.consent-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 1.5rem;
flex-wrap: wrap;
gap: 1rem;
}
.consent-card {
border: none;
box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
border-radius: 0.5rem;
margin-bottom: 1.5rem;
}
.consent-content {
background-color: #f8f9fa;
border: 1px solid #dee2e6;
border-radius: 0.375rem;
padding: 1.5rem;
white-space: pre-wrap;
font-size: 0.95rem;
line-height: 1.6;
max-height: 500px;
overflow-y: auto;
}
.signature-display {
border: 2px solid #28a745;
border-radius: 0.375rem;
padding: 1rem;
background-color: white;
text-align: center;
}
.signature-display img {
max-width: 100%;
height: auto;
max-height: 200px;
}
.verification-badge {
display: inline-flex;
align-items: center;
gap: 0.5rem;
padding: 0.5rem 1rem;
border-radius: 0.375rem;
font-size: 0.875rem;
}
.verification-badge.verified {
background-color: #d4edda;
color: #155724;
border: 1px solid #c3e6cb;
}
.verification-badge.unverified {
background-color: #f8d7da;
color: #721c24;
border: 1px solid #f5c6cb;
}
@media print {
.consent-header .btn,
.no-print {
display: none;
}
.consent-card {
box-shadow: none;
border: 1px solid #dee2e6;
}
}
</style>
{% endblock %}
{% block content %}
<div class="container-fluid consent-detail-container">
<!-- Header -->
<div class="consent-header">
<h1>
<i class="fa fa-file-signature me-2"></i>
{% trans "Consent Details" %}
</h1>
<div class="btn-group no-print">
<button onclick="window.print()" class="btn btn-outline-primary">
<i class="fa fa-print me-1"></i>{% trans "Print" %}
</button>
<a href="{% url 'core:consent_list' %}" class="btn btn-secondary">
<i class="fa fa-arrow-left me-1"></i>{% trans "Back to List" %}
</a>
</div>
</div>
<!-- Messages -->
<div class="row">
<div class="col-12 col-lg-10 offset-lg-1">
<!-- Patient & Consent Info -->
<div class="card consent-card">
<div class="card-header bg-primary text-white">
<h5 class="mb-0">
<i class="fa fa-info-circle me-2"></i>{% trans "Consent Information" %}
</h5>
</div>
<div class="card-body">
<div class="row">
<div class="col-md-6">
<dl class="row">
<dt class="col-sm-5">{% trans "Patient" %}:</dt>
<dd class="col-sm-7">
<strong>{{ consent.patient.full_name_en }}</strong><br>
<small class="text-muted">MRN: {{ consent.patient.mrn }}</small>
</dd>
<dt class="col-sm-5">{% trans "Consent Type" %}:</dt>
<dd class="col-sm-7">
<span class="badge bg-info">{{ consent.get_consent_type_display }}</span>
</dd>
<dt class="col-sm-5">{% trans "Version" %}:</dt>
<dd class="col-sm-7">{{ consent.version }}</dd>
<dt class="col-sm-5">{% trans "Status" %}:</dt>
<dd class="col-sm-7">
{% if consent.is_active %}
<span class="badge bg-success">{% trans "Active" %}</span>
{% else %}
<span class="badge bg-secondary">{% trans "Inactive" %}</span>
{% endif %}
</dd>
</dl>
</div>
<div class="col-md-6">
<dl class="row">
<dt class="col-sm-5">{% trans "Signed By" %}:</dt>
<dd class="col-sm-7">
<strong>{{ consent.signed_by_name }}</strong>
{% if consent.signed_by_relationship %}
<br><small class="text-muted">{{ consent.signed_by_relationship }}</small>
{% endif %}
</dd>
<dt class="col-sm-5">{% trans "Signed At" %}:</dt>
<dd class="col-sm-7">
{% if consent.signed_at %}
{{ consent.signed_at|date:"Y-m-d H:i" }}
{% else %}
<span class="text-muted">{% trans "Not signed" %}</span>
{% endif %}
</dd>
<dt class="col-sm-5">{% trans "Signature Method" %}:</dt>
<dd class="col-sm-7">
{% if consent.signature_method %}
{{ consent.get_signature_method_display }}
{% else %}
<span class="text-muted"></span>
{% endif %}
</dd>
<dt class="col-sm-5">{% trans "Created" %}:</dt>
<dd class="col-sm-7">{{ consent.created_at|date:"Y-m-d H:i" }}</dd>
</dl>
</div>
</div>
</div>
</div>
<!-- Consent Content -->
<div class="card consent-card">
<div class="card-header">
<h5 class="mb-0">
<i class="fa fa-file-alt me-2"></i>{% trans "Consent Content" %}
</h5>
</div>
<div class="card-body">
<div class="consent-content">{{ consent.content_text }}</div>
</div>
</div>
<!-- Signature -->
{% if consent.signature_image %}
<div class="card consent-card">
<div class="card-header">
<h5 class="mb-0">
<i class="fa fa-pen-nib me-2"></i>{% trans "Signature" %}
</h5>
</div>
<div class="card-body">
<div class="row">
<div class="col-md-8">
<div class="signature-display">
<img src="{{ consent.signature_image.url }}" alt="{% trans 'Signature' %}">
</div>
</div>
<div class="col-md-4">
<h6>{% trans "Verification" %}</h6>
{% if signature_verified %}
<div class="verification-badge verified">
<i class="fa fa-check-circle"></i>
<span>{% trans "Signature Verified" %}</span>
</div>
{% elif signature_verified == False %}
<div class="verification-badge unverified">
<i class="fa fa-exclamation-triangle"></i>
<span>{% trans "Verification Failed" %}</span>
</div>
{% endif %}
<div class="mt-3">
<small class="text-muted">
<strong>{% trans "Hash" %}:</strong><br>
<code style="font-size: 0.7rem; word-break: break-all;">{{ consent.signature_hash|truncatechars:32 }}</code>
</small>
</div>
</div>
</div>
</div>
</div>
{% endif %}
<!-- Technical Details -->
<div class="card consent-card no-print">
<div class="card-header">
<h5 class="mb-0">
<i class="fa fa-cog me-2"></i>{% trans "Technical Details" %}
</h5>
</div>
<div class="card-body">
<dl class="row mb-0">
<dt class="col-sm-3">{% trans "Signed IP" %}:</dt>
<dd class="col-sm-9">{{ consent.signed_ip|default:"—" }}</dd>
<dt class="col-sm-3">{% trans "User Agent" %}:</dt>
<dd class="col-sm-9">
<small class="text-muted">{{ consent.signed_user_agent|default:"—"|truncatechars:100 }}</small>
</dd>
<dt class="col-sm-3">{% trans "Consent ID" %}:</dt>
<dd class="col-sm-9"><code>{{ consent.id }}</code></dd>
<dt class="col-sm-3">{% trans "Last Updated" %}:</dt>
<dd class="col-sm-9">{{ consent.updated_at|date:"Y-m-d H:i:s" }}</dd>
</dl>
</div>
</div>
</div>
</div>
</div>
{% endblock %}