hospital-management/templates/blood_bank/requests/blood_request_confirm_delete.html
Marwan Alwali 35be20ae4c update
2025-09-06 19:07:14 +03:00

465 lines
20 KiB
HTML

{% extends 'base.html' %}
{% load static %}
{% block title %}Cancel Blood Request - {{ blood_request.request_number }}{% endblock %}
{% block css %}
<style>
.delete-warning {
background: #f8d7da;
border: 2px solid #dc3545;
border-radius: 8px;
padding: 20px;
margin-bottom: 20px;
animation: pulse 2s infinite;
}
@keyframes pulse {
0% { opacity: 1; }
50% { opacity: 0.8; }
100% { opacity: 1; }
}
.request-info {
background: #d1ecf1;
border-left: 4px solid #17a2b8;
border-radius: 8px;
padding: 20px;
margin-bottom: 20px;
}
.impact-assessment {
background: #fff3cd;
border-left: 4px solid #ffc107;
border-radius: 8px;
padding: 20px;
margin-bottom: 20px;
}
.cancellation-options {
background: #d4edda;
border-left: 4px solid #28a745;
border-radius: 8px;
padding: 20px;
margin-bottom: 20px;
}
.required-field {
color: #dc3545;
}
.emergency-warning {
background: #dc3545;
color: white;
padding: 15px;
border-radius: 8px;
margin-bottom: 20px;
text-align: center;
font-weight: bold;
}
</style>
{% endblock %}
{% block content %}
<!-- BEGIN breadcrumb -->
<ol class="breadcrumb float-xl-end">
<li class="breadcrumb-item"><a href="{% url 'core:dashboard' %}">Home</a></li>
<li class="breadcrumb-item"><a href="{% url 'blood_bank:dashboard' %}">Blood Bank</a></li>
<li class="breadcrumb-item"><a href="{% url 'blood_bank:blood_request_list' %}">Blood Requests</a></li>
<li class="breadcrumb-item"><a href="{% url 'blood_bank:blood_request_detail' blood_request.id %}">{{ blood_request.request_number }}</a></li>
<li class="breadcrumb-item active">Cancel Request</li>
</ol>
<!-- END breadcrumb -->
<!-- BEGIN page-header -->
<h1 class="page-header">
Cancel Blood Request
<small>{{ blood_request.request_number }}</small>
{% if blood_request.urgency == 'emergency' %}
<span class="badge bg-danger ms-2">EMERGENCY</span>
{% endif %}
</h1>
<!-- END page-header -->
{% if blood_request.urgency == 'emergency' %}
<!-- BEGIN emergency warning -->
<div class="emergency-warning">
<i class="fa fa-exclamation-triangle fa-2x"></i><br>
WARNING: This is an EMERGENCY blood request. Cancellation requires immediate supervisor approval.
</div>
<!-- END emergency warning -->
{% endif %}
<!-- BEGIN panel -->
<div class="panel panel-inverse">
<div class="panel-heading">
<h4 class="panel-title">
<i class="fa fa-times-circle"></i> Cancel Blood Request
</h4>
<div class="panel-heading-btn">
<span class="badge bg-warning">Cancellation Required</span>
</div>
</div>
<div class="panel-body">
<!-- BEGIN delete warning -->
<div class="delete-warning">
<h5><i class="fa fa-exclamation-triangle"></i> CRITICAL ACTION REQUIRED</h5>
<p class="mb-2"><strong>You are about to cancel a blood request.</strong></p>
<p class="mb-0">This action will:</p>
<ul class="mb-0">
<li>Cancel the blood request permanently</li>
<li>Release any reserved blood units</li>
<li>Notify the requesting physician</li>
<li>Create an audit trail entry</li>
{% if blood_request.urgency == 'emergency' %}
<li><strong>Require supervisor approval for emergency request</strong></li>
{% endif %}
</ul>
</div>
<!-- END delete warning -->
<!-- BEGIN request information -->
<div class="request-info">
<h5><i class="fa fa-file-medical"></i> Request Information</h5>
<div class="row">
<div class="col-md-6">
<table class="table table-borderless mb-0">
<tr>
<td class="fw-bold">Request Number:</td>
<td>{{ blood_request.request_number }}</td>
</tr>
<tr>
<td class="fw-bold">Patient:</td>
<td>{{ blood_request.patient.full_name }} ({{ blood_request.patient.patient_id }})</td>
</tr>
<tr>
<td class="fw-bold">Blood Group:</td>
<td><span class="badge bg-primary">{{ blood_request.patient.blood_group.display_name }}</span></td>
</tr>
<tr>
<td class="fw-bold">Component:</td>
<td>{{ blood_request.component.get_name_display }}</td>
</tr>
</table>
</div>
<div class="col-md-6">
<table class="table table-borderless mb-0">
<tr>
<td class="fw-bold">Quantity:</td>
<td>{{ blood_request.quantity_requested }} units</td>
</tr>
<tr>
<td class="fw-bold">Urgency:</td>
<td>
<span class="badge bg-{% if blood_request.urgency == 'emergency' %}danger{% elif blood_request.urgency == 'urgent' %}warning{% else %}info{% endif %}">
{{ blood_request.get_urgency_display }}
</span>
</td>
</tr>
<tr>
<td class="fw-bold">Requested By:</td>
<td>{{ blood_request.requested_by.get_full_name }}</td>
</tr>
<tr>
<td class="fw-bold">Department:</td>
<td>{{ blood_request.department.name }}</td>
</tr>
</table>
</div>
</div>
{% if blood_request.clinical_indication %}
<div class="mt-3">
<h6>Clinical Indication:</h6>
<div class="alert alert-info">{{ blood_request.clinical_indication }}</div>
</div>
{% endif %}
</div>
<!-- END request information -->
<!-- BEGIN impact assessment -->
<div class="impact-assessment">
<h5><i class="fa fa-exclamation-circle"></i> Impact Assessment</h5>
<div class="row">
<div class="col-md-6">
<h6>Current Status</h6>
<ul>
<li><strong>Request Status:</strong> {{ blood_request.get_status_display }}</li>
<li><strong>Units Reserved:</strong> {{ blood_request.reserved_units.count }} units</li>
<li><strong>Units Issued:</strong> {{ blood_request.issued_units.count }} units</li>
<li><strong>Crossmatches Done:</strong> {{ blood_request.crossmatches.count }}</li>
</ul>
</div>
<div class="col-md-6">
<h6>Affected Records</h6>
<ul>
{% if blood_request.reserved_units.exists %}
<li class="text-warning">Reserved blood units will be released</li>
{% endif %}
{% if blood_request.issued_units.exists %}
<li class="text-danger">Issued units require immediate return</li>
{% endif %}
{% if blood_request.crossmatches.exists %}
<li class="text-info">Crossmatch results will be archived</li>
{% endif %}
<li class="text-info">Audit trail will be created</li>
</ul>
</div>
</div>
{% if blood_request.issued_units.exists %}
<div class="alert alert-danger mt-3">
<strong><i class="fa fa-exclamation-triangle"></i> WARNING:</strong>
This request has issued blood units that must be returned immediately before cancellation.
</div>
{% endif %}
</div>
<!-- END impact assessment -->
<!-- BEGIN cancellation form -->
<form method="post" id="cancellationForm">
{% csrf_token %}
<div class="cancellation-options">
<h5><i class="fa fa-clipboard-list"></i> Cancellation Details</h5>
<div class="row">
<div class="col-md-6">
<div class="form-group">
<label for="cancellationReason" class="form-label">
Cancellation Reason <span class="required-field">*</span>
</label>
<select class="form-select" id="cancellationReason" name="cancellation_reason" required>
<option value="">Select reason...</option>
<option value="patient_condition_improved">Patient condition improved</option>
<option value="surgery_cancelled">Surgery cancelled</option>
<option value="patient_discharged">Patient discharged</option>
<option value="alternative_treatment">Alternative treatment chosen</option>
<option value="physician_decision">Physician decision</option>
<option value="patient_refusal">Patient refusal</option>
<option value="duplicate_request">Duplicate request</option>
<option value="incorrect_request">Incorrect request details</option>
<option value="other">Other (specify below)</option>
</select>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label for="cancelledBy" class="form-label">
Cancelled By <span class="required-field">*</span>
</label>
<select class="form-select" id="cancelledBy" name="cancelled_by" required>
<option value="">Select staff member...</option>
{% for staff in authorized_staff %}
<option value="{{ staff.id }}">{{ staff.get_full_name }}</option>
{% endfor %}
</select>
</div>
</div>
</div>
{% if blood_request.urgency == 'emergency' %}
<div class="row">
<div class="col-md-6">
<div class="form-group">
<label for="supervisorApproval" class="form-label">
Supervisor Approval <span class="required-field">*</span>
</label>
<select class="form-select" id="supervisorApproval" name="supervisor_approval" required>
<option value="">Select supervisor...</option>
{% for supervisor in supervisors %}
<option value="{{ supervisor.id }}">{{ supervisor.get_full_name }}</option>
{% endfor %}
</select>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label for="approvalCode" class="form-label">
Approval Code <span class="required-field">*</span>
</label>
<input type="text" class="form-control" id="approvalCode" name="approval_code"
placeholder="Enter supervisor approval code" required>
</div>
</div>
</div>
{% endif %}
<div class="row">
<div class="col-md-12">
<div class="form-group">
<label for="cancellationNotes" class="form-label">
Detailed Notes <span class="required-field">*</span>
</label>
<textarea class="form-control" id="cancellationNotes" name="cancellation_notes"
rows="4" required placeholder="Provide detailed explanation for the cancellation..."></textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="form-group">
<label for="notifyPhysician" class="form-label">Notify Requesting Physician</label>
<div class="form-check form-switch">
<input class="form-check-input" type="checkbox" id="notifyPhysician"
name="notify_physician" checked>
<label class="form-check-label" for="notifyPhysician">
Send notification to {{ blood_request.requested_by.get_full_name }}
</label>
</div>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label for="notifyDepartment" class="form-label">Notify Department</label>
<div class="form-check form-switch">
<input class="form-check-input" type="checkbox" id="notifyDepartment"
name="notify_department" checked>
<label class="form-check-label" for="notifyDepartment">
Send notification to {{ blood_request.department.name }}
</label>
</div>
</div>
</div>
</div>
</div>
<!-- BEGIN confirmation checklist -->
<div class="alert alert-warning">
<h6><i class="fa fa-check-square"></i> Confirmation Checklist</h6>
<div class="form-check">
<input class="form-check-input" type="checkbox" id="confirmUnderstand" required>
<label class="form-check-label" for="confirmUnderstand">
I understand that this action will permanently cancel the blood request
</label>
</div>
<div class="form-check">
<input class="form-check-input" type="checkbox" id="confirmNotifications" required>
<label class="form-check-label" for="confirmNotifications">
I confirm that appropriate notifications will be sent
</label>
</div>
<div class="form-check">
<input class="form-check-input" type="checkbox" id="confirmDocumentation" required>
<label class="form-check-label" for="confirmDocumentation">
I confirm that proper documentation has been provided
</label>
</div>
{% if blood_request.issued_units.exists %}
<div class="form-check">
<input class="form-check-input" type="checkbox" id="confirmUnitsReturned" required>
<label class="form-check-label" for="confirmUnitsReturned">
I confirm that all issued blood units have been returned
</label>
</div>
{% endif %}
</div>
<!-- END confirmation checklist -->
<!-- BEGIN form actions -->
<div class="d-flex justify-content-between mt-4">
<a href="{% url 'blood_bank:blood_request_detail' blood_request.id %}" class="btn btn-secondary">
<i class="fa fa-arrow-left"></i> Keep Request Active
</a>
<div>
<button type="button" class="btn btn-info" onclick="validateCancellation()">
<i class="fa fa-check"></i> Validate Cancellation
</button>
<button type="submit" class="btn btn-danger" id="submitBtn" disabled>
<i class="fa fa-times-circle"></i> Cancel Blood Request
</button>
</div>
</div>
<!-- END form actions -->
</form>
<!-- END cancellation form -->
</div>
</div>
<!-- END panel -->
{% endblock %}
{% block js %}
<script>
$(document).ready(function() {
// Form validation
$('.form-check-input').on('change', function() {
validateCancellation();
});
$('#cancellationReason, #cancelledBy, #cancellationNotes').on('change input', function() {
validateCancellation();
});
{% if blood_request.urgency == 'emergency' %}
$('#supervisorApproval, #approvalCode').on('change input', function() {
validateCancellation();
});
{% endif %}
$('#cancellationForm').on('submit', function(e) {
if (!validateCancellation()) {
e.preventDefault();
} else {
// Final confirmation
if (!confirm('Are you absolutely sure you want to cancel this blood request? This action cannot be undone.')) {
e.preventDefault();
}
}
});
});
function validateCancellation() {
var errors = [];
// Check required fields
if (!$('#cancellationReason').val()) {
errors.push('Please select a cancellation reason');
}
if (!$('#cancelledBy').val()) {
errors.push('Please select who is cancelling the request');
}
if (!$('#cancellationNotes').val().trim()) {
errors.push('Please provide detailed notes for the cancellation');
}
{% if blood_request.urgency == 'emergency' %}
if (!$('#supervisorApproval').val()) {
errors.push('Supervisor approval is required for emergency requests');
}
if (!$('#approvalCode').val().trim()) {
errors.push('Approval code is required for emergency requests');
}
{% endif %}
// Check confirmation checkboxes
var requiredCheckboxes = ['confirmUnderstand', 'confirmNotifications', 'confirmDocumentation'];
{% if blood_request.issued_units.exists %}
requiredCheckboxes.push('confirmUnitsReturned');
{% endif %}
var uncheckedBoxes = requiredCheckboxes.filter(function(id) {
return !document.getElementById(id).checked;
});
if (uncheckedBoxes.length > 0) {
errors.push('Please confirm all checklist items');
}
// Enable/disable submit button
$('#submitBtn').prop('disabled', errors.length > 0);
if (errors.length > 0 && errors.length < 6) {
// Only show errors if there are just a few (user is actively trying to submit)
return false;
}
return true;
}
</script>
{% endblock %}