231 lines
12 KiB
HTML
231 lines
12 KiB
HTML
{% extends "base.html" %}
|
|
{% load static %}
|
|
|
|
{% block title %}Patient Registration - {{ block.super }}{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="container-fluid">
|
|
<div class="row">
|
|
<div class="col-12">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h4 class="card-title mb-0">
|
|
<i class="fas fa-user-plus me-2"></i>Patient Registration
|
|
</h4>
|
|
</div>
|
|
|
|
<div class="card-body">
|
|
<form id="patient-registration-form" method="post">
|
|
{% csrf_token %}
|
|
|
|
<!-- Personal Information -->
|
|
<div class="row mb-4">
|
|
<div class="col-12">
|
|
<h5 class="border-bottom pb-2">Personal Information</h5>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<div class="mb-3">
|
|
<label for="first_name" class="form-label">First Name *</label>
|
|
<input type="text" class="form-control" id="first_name" name="first_name" required>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<div class="mb-3">
|
|
<label for="last_name" class="form-label">Last Name *</label>
|
|
<input type="text" class="form-control" id="last_name" name="last_name" required>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<div class="mb-3">
|
|
<label for="middle_name" class="form-label">Middle Name</label>
|
|
<input type="text" class="form-control" id="middle_name" name="middle_name">
|
|
</div>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<div class="mb-3">
|
|
<label for="date_of_birth" class="form-label">Date of Birth *</label>
|
|
<input type="date" class="form-control" id="date_of_birth" name="date_of_birth" required>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<div class="mb-3">
|
|
<label for="gender" class="form-label">Gender *</label>
|
|
<select class="form-select" id="gender" name="gender" required>
|
|
<option value="">Select gender...</option>
|
|
<option value="MALE">Male</option>
|
|
<option value="FEMALE">Female</option>
|
|
<option value="OTHER">Other</option>
|
|
<option value="UNKNOWN">Prefer not to say</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<div class="mb-3">
|
|
<label for="ssn" class="form-label">SSN</label>
|
|
<input type="text" class="form-control" id="ssn" name="ssn" placeholder="XXX-XX-XXXX">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Contact Information -->
|
|
<div class="row mb-4">
|
|
<div class="col-12">
|
|
<h5 class="border-bottom pb-2">Contact Information</h5>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="mb-3">
|
|
<label for="phone_number" class="form-label">Phone Number</label>
|
|
<input type="tel" class="form-control" id="phone_number" name="phone_number">
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="mb-3">
|
|
<label for="email" class="form-label">Email Address</label>
|
|
<input type="email" class="form-control" id="email" name="email">
|
|
</div>
|
|
</div>
|
|
<div class="col-12">
|
|
<div class="mb-3">
|
|
<label for="address" class="form-label">Address</label>
|
|
<textarea class="form-control" id="address" name="address" rows="2"></textarea>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Emergency Contact -->
|
|
<div class="row mb-4">
|
|
<div class="col-12">
|
|
<h5 class="border-bottom pb-2">Emergency Contact</h5>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<div class="mb-3">
|
|
<label for="emergency_name" class="form-label">Full Name *</label>
|
|
<input type="text" class="form-control" id="emergency_name" name="emergency_name" required>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<div class="mb-3">
|
|
<label for="emergency_relationship" class="form-label">Relationship *</label>
|
|
<select class="form-select" id="emergency_relationship" name="emergency_relationship" required>
|
|
<option value="">Select relationship...</option>
|
|
<option value="SPOUSE">Spouse</option>
|
|
<option value="PARENT">Parent</option>
|
|
<option value="CHILD">Child</option>
|
|
<option value="SIBLING">Sibling</option>
|
|
<option value="FRIEND">Friend</option>
|
|
<option value="OTHER">Other</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<div class="mb-3">
|
|
<label for="emergency_phone" class="form-label">Phone Number *</label>
|
|
<input type="tel" class="form-control" id="emergency_phone" name="emergency_phone" required>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Insurance Information -->
|
|
<div class="row mb-4">
|
|
<div class="col-12">
|
|
<h5 class="border-bottom pb-2">Insurance Information</h5>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="mb-3">
|
|
<label for="insurance_provider" class="form-label">Insurance Provider</label>
|
|
<input type="text" class="form-control" id="insurance_provider" name="insurance_provider">
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="mb-3">
|
|
<label for="insurance_policy_number" class="form-label">Policy Number</label>
|
|
<input type="text" class="form-control" id="insurance_policy_number" name="insurance_policy_number">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Consent Forms -->
|
|
{% if consent_templates %}
|
|
<div class="row mb-4">
|
|
<div class="col-12">
|
|
<h5 class="border-bottom pb-2">Consent Forms</h5>
|
|
{% for template in consent_templates %}
|
|
<div class="form-check mb-2">
|
|
<input class="form-check-input" type="checkbox"
|
|
id="consent_{{ template.id }}"
|
|
name="consent_templates"
|
|
value="{{ template.id }}"
|
|
{% if template.is_required %}required{% endif %}>
|
|
<label class="form-check-label" for="consent_{{ template.id }}">
|
|
{{ template.name }}
|
|
{% if template.is_required %}<span class="text-danger">*</span>{% endif %}
|
|
</label>
|
|
{% if template.description %}
|
|
<div class="form-text">{{ template.description }}</div>
|
|
{% endif %}
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
|
|
<!-- Submit Buttons -->
|
|
<div class="row">
|
|
<div class="col-12">
|
|
<div class="d-flex justify-content-end gap-2">
|
|
<button type="button" class="btn btn-secondary">Cancel</button>
|
|
<button type="submit" class="btn btn-primary">
|
|
<i class="fas fa-save me-1"></i>Register Patient
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|
|
|
|
{% block js %}
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
// Form validation and submission
|
|
document.getElementById('patient-registration-form').addEventListener('submit', function(e) {
|
|
e.preventDefault();
|
|
|
|
// Basic validation
|
|
const requiredFields = this.querySelectorAll('[required]');
|
|
let isValid = true;
|
|
|
|
requiredFields.forEach(field => {
|
|
if (!field.value.trim()) {
|
|
field.classList.add('is-invalid');
|
|
isValid = false;
|
|
} else {
|
|
field.classList.remove('is-invalid');
|
|
}
|
|
});
|
|
|
|
if (isValid) {
|
|
// Submit form
|
|
this.submit();
|
|
}
|
|
});
|
|
|
|
// SSN formatting
|
|
document.getElementById('ssn').addEventListener('input', function(e) {
|
|
let value = e.target.value.replace(/\D/g, '');
|
|
if (value.length >= 6) {
|
|
value = value.substring(0,3) + '-' + value.substring(3,5) + '-' + value.substring(5,9);
|
|
} else if (value.length >= 4) {
|
|
value = value.substring(0,3) + '-' + value.substring(3);
|
|
}
|
|
e.target.value = value;
|
|
});
|
|
});
|
|
</script>
|
|
{% endblock %}
|
|
|