|
|
<!DOCTYPE html>
|
|
|
<html lang="en">
|
|
|
<head>
|
|
|
<meta charset="UTF-8">
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
<title>Doctor Dashboard - Care Plan Management System</title>
|
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet">
|
|
|
<style>
|
|
|
:root {
|
|
|
--primary-blue: #0d6efd;
|
|
|
--light-blue: #e7f1ff;
|
|
|
--dark-blue: #0a58ca;
|
|
|
}
|
|
|
|
|
|
body {
|
|
|
background-color: #f8f9fa;
|
|
|
}
|
|
|
|
|
|
.navbar {
|
|
|
background-color: var(--primary-blue);
|
|
|
padding: 1rem;
|
|
|
}
|
|
|
|
|
|
.navbar-brand {
|
|
|
color: white !important;
|
|
|
font-weight: bold;
|
|
|
}
|
|
|
|
|
|
.container {
|
|
|
max-width: 1000px;
|
|
|
margin-top: 30px;
|
|
|
}
|
|
|
|
|
|
.card {
|
|
|
border: none;
|
|
|
border-radius: 15px;
|
|
|
box-shadow: 0 0 15px rgba(0,0,0,0.1);
|
|
|
margin-bottom: 20px;
|
|
|
}
|
|
|
|
|
|
.card-header {
|
|
|
background-color: var(--light-blue);
|
|
|
border-radius: 15px 15px 0 0 !important;
|
|
|
border-bottom: none;
|
|
|
padding: 1.5rem;
|
|
|
}
|
|
|
|
|
|
.emergency-alert {
|
|
|
background-color: #dc3545;
|
|
|
color: white;
|
|
|
padding: 15px;
|
|
|
border-radius: 10px;
|
|
|
margin-bottom: 20px;
|
|
|
}
|
|
|
|
|
|
.role-switcher {
|
|
|
position: fixed;
|
|
|
top: 20px;
|
|
|
right: 20px;
|
|
|
z-index: 1000;
|
|
|
}
|
|
|
</style>
|
|
|
</head>
|
|
|
<body>
|
|
|
<nav class="navbar">
|
|
|
<div class="container">
|
|
|
<a class="navbar-brand" href="#">Doctor Dashboard</a>
|
|
|
<div class="role-switcher">
|
|
|
<select class="form-select" id="roleSelect" onchange="switchRole()">
|
|
|
<option value="doctor" selected>Doctor View</option>
|
|
|
<option value="patient">Patient View</option>
|
|
|
</select>
|
|
|
</div>
|
|
|
</div>
|
|
|
</nav>
|
|
|
|
|
|
<div class="container">
|
|
|
<div class="card">
|
|
|
<div class="card-header">
|
|
|
<h3 class="mb-0">Emergency Notifications</h3>
|
|
|
</div>
|
|
|
<div class="card-body">
|
|
|
<div id="emergencyNotifications">
|
|
|
<div class="text-center" id="noNotifications">
|
|
|
No emergency notifications at this time
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<script>
|
|
|
function switchRole() {
|
|
|
const role = document.getElementById('roleSelect').value;
|
|
|
if (role === 'patient') {
|
|
|
window.location.href = '/';
|
|
|
}
|
|
|
}
|
|
|
|
|
|
async function fetchEmergencyNotifications() {
|
|
|
try {
|
|
|
const response = await fetch('/get_emergency_notifications');
|
|
|
const data = await response.json();
|
|
|
|
|
|
if (data.success) {
|
|
|
const notificationsDiv = document.getElementById('emergencyNotifications');
|
|
|
const noNotificationsDiv = document.getElementById('noNotifications');
|
|
|
|
|
|
if (data.notifications && data.notifications.length > 0) {
|
|
|
notificationsDiv.innerHTML = '';
|
|
|
data.notifications.forEach(notification => {
|
|
|
const notificationElement = document.createElement('div');
|
|
|
notificationElement.className = 'emergency-alert';
|
|
|
notificationElement.innerHTML = `
|
|
|
<h4>Emergency Alert</h4>
|
|
|
<p>Time: ${notification.timestamp}</p>
|
|
|
<p>Patient Feedback: ${notification.patient_feedback}</p>
|
|
|
`;
|
|
|
notificationsDiv.appendChild(notificationElement);
|
|
|
});
|
|
|
} else {
|
|
|
notificationsDiv.innerHTML = '<div class="text-center">No emergency notifications at this time</div>';
|
|
|
}
|
|
|
}
|
|
|
} catch (error) {
|
|
|
console.error('Error fetching notifications:', error);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
|
|
|
fetchEmergencyNotifications();
|
|
|
|
|
|
|
|
|
setInterval(fetchEmergencyNotifications, 30000);
|
|
|
</script>
|
|
|
</body>
|
|
|
</html> |
