File size: 9,438 Bytes
96637b1 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 |
<!DOCTYPE html>
<html lang="ar" dir="rtl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>إدارة الأطباء - نظام إدارة المستشفى</title>
<link rel="icon" type="image/x-icon" href="/static/favicon.ico">
<script src="https://cdn.tailwindcss.com"></script>
<script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/animejs/lib/anime.iife.min.js"></script>
<style>
@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@300;400;500;700&display=swap');
body { font-family: 'Tajawal', sans-serif; }
</style>
</head>
<body class="bg-gray-50">
<!-- Navigation -->
<nav class="bg-white shadow-lg sticky top-0 z-50">
<div class="max-w-7xl mx-auto px-4">
<div class="flex justify-between items-center py-4">
<div class="flex items-center space-x-reverse space-x-2">
<i data-feather="activity" class="w-8 h-8 text-blue-600"></i>
<span class="text-xl font-bold text-gray-800">نظام إدارة المستشفى</span>
</div>
<div class="hidden md:flex space-x-reverse space-x-6">
<a href="index.html" class="text-gray-600 hover:text-blue-600">الرئيسية</a>
<a href="patients.html" class="text-gray-600 hover:text-blue-600">المرضى</a>
<a href="doctors.html" class="text-blue-600 font-medium">الأطباء</a>
<a href="appointments.html" class="text-gray-600 hover:text-blue-600">المواعيد</a>
<a href="departments.html" class="text-gray-600 hover:text-blue-600">الأقسام</a>
<a href="emergency.html" class="text-gray-600 hover:text-blue-600">الطوارئ</a>
</div>
</div>
</div>
</nav>
<div class="max-w-7xl mx-auto px-4 py-8">
<div class="flex justify-between items-center mb-8">
<h1 class="text-3xl font-bold text-gray-800">إدارة الأطباء</h1>
<a href="doctor-registration.html" class="bg-blue-600 text-white px-6 py-2 rounded-lg hover:bg-blue-700 flex items-center space-x-reverse space-x-2">
<i data-feather="user-plus" class="w-5 h-5"></i>
<span>إضافة طبيب جديد</span>
</a>
</div>
<!-- Doctors Grid -->
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
<div class="bg-white rounded-lg shadow-md overflow-hidden hover:shadow-xl transition-shadow">
<div class="p-6">
<div class="flex items-center space-x-reverse space-x-4 mb-4">
<img src="http://static.photos/people/200x200/1" alt="Doctor" class="w-20 h-20 rounded-full">
<div>
<h3 class="text-lg font-semibold text-gray-800">د. أحمد محمد</h3>
<p class="text-sm text-gray-600">استشاري قلب</p>
<div class="flex items-center mt-1">
<i data-feather="star" class="w-4 h-4 text-yellow-400 fill-current"></i>
<span class="text-sm text-gray-600 mr-1">4.8</span>
</div>
</div>
</div>
<div class="space-y-2 text-sm text-gray-600">
<div class="flex items-center">
<i data-feather="briefcase" class="w-4 h-4 ml-2"></i>
<span>15 سنة خبرة</span>
</div>
<div class="flex items-center">
<i data-feather="map-pin" class="w-4 h-4 ml-2"></i>
<span>الطابق الثاني - غرفة 201</span>
</div>
<div class="flex items-center">
<i data-feather="calendar" class="w-4 h-4 ml-2"></i>
<span>الأحد - الخميس</span>
</div>
</div>
<div class="mt-4 flex space-x-reverse space-x-2">
<a href="doctor-details.html" class="flex-1 bg-blue-600 text-white text-center py-2 rounded hover:bg-blue-700">الملف</a>
<a href="appointment-scheduling.html" class="flex-1 bg-green-600 text-white text-center py-2 rounded hover:bg-green-700">حجز</a>
</div>
</div>
</div>
<div class="bg-white rounded-lg shadow-md overflow-hidden hover:shadow-xl transition-shadow">
<div class="p-6">
<div class="flex items-center space-x-reverse space-x-4 mb-4">
<img src="http://static.photos/people/200x200/2" alt="Doctor" class="w-20 h-20 rounded-full">
<div>
<h3 class="text-lg font-semibold text-gray-800">د. سارة أحمد</h3>
<p class="text-sm text-gray-600">استشارية نساء وتوليد</p>
<div class="flex items-center mt-1">
<i data-feather="star" class="w-4 h-4 text-yellow-400 fill-current"></i>
<span class="text-sm text-gray-600 mr-1">4.9</span>
</div>
</div>
</div>
<div class="space-y-2 text-sm text-gray-600">
<div class="flex items-center">
<i data-feather="briefcase" class="w-4 h-4 ml-2"></i>
<span>12 سنة خبرة</span>
</div>
<div class="flex items-center">
<i data-feather="map-pin" class="w-4 h-4 ml-2"></i>
<span>الطابق الثالث - غرفة 305</span>
</div>
<div class="flex items-center">
<i data-feather="calendar" class="w-4 h-4 ml-2"></i>
<span>الأحد - السبت</span>
</div>
</div>
<div class="mt-4 flex space-x-reverse space-x-2">
<a href="doctor-details.html" class="flex-1 bg-blue-600 text-white text-center py-2 rounded hover:bg-blue-700">الملف</a>
<a href="appointment-scheduling.html" class="flex-1 bg-green-600 text-white text-center py-2 rounded hover:bg-green-700">حجز</a>
</div>
</div>
</div>
<div class="bg-white rounded-lg shadow-md overflow-hidden hover:shadow-xl transition-shadow">
<div class="p-6">
<div class="flex items-center space-x-reverse space-x-4 mb-4">
<img src="http://static.photos/people/200x200/3" alt="Doctor" class="w-20 h-20 rounded-full">
<div>
<h3 class="text-lg font-semibold text-gray-800">د. محمود علي</h3>
<p class="text-sm text-gray-600">استشاري أطفال</p>
<div class="flex items-center mt-1">
<i data-feather="star" class="w-4 h-4 text-yellow-400 fill-current"></i>
<span class="text-sm text-gray-600 mr-1">4.7</span>
</div>
</div>
</div>
<div class="space-y-2 text-sm text-gray-600">
<div class="flex items-center">
<i data-feather="briefcase" class="w-4 h-4 ml-2"></i>
<span>10 سنة خبرة</span>
</div>
<div class="flex items-center">
<i data-feather="map-pin" class="w-4 h-4 ml-2"></i>
<span>الطابق الأول - غرفة 105</span>
</div>
<div class="flex items-center">
<i data-feather="calendar" class="w-4 h-4 ml-2"></i>
<span>السبت - الأربعاء</span>
</div>
</div>
<div class="mt-4 flex space-x-reverse space-x-2">
<a href="doctor-details.html" class="flex-1 bg-blue-600 text-white text-center py-2 rounded hover:bg-blue-700">الملف</a>
<a href="appointment-scheduling.html" class="flex-1 bg-green-600 text-white text-center py-2 rounded hover:bg-green-700">حجز</a>
</div>
</div>
</div>
</div>
</div>
<script>
feather.replace();
anime({
targets: '.bg-white',
scale: [0.9, 1],
opacity: [0, 1],
delay: anime.stagger(100),
duration: 600,
easing: 'easeOutQuad'
});
</script>
</body>
</html> |