|
|
<!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 href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet"> |
|
|
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet"> |
|
|
<link href="../css/admin.css" rel="stylesheet"> |
|
|
</head> |
|
|
<body class="admin-dashboard"> |
|
|
|
|
|
<div class="sidebar"> |
|
|
<div class="sidebar-header"> |
|
|
<h4 class="text-white"> |
|
|
<i class="fas fa-book-reader me-2"></i> |
|
|
بورتسودان تقرأ |
|
|
</h4> |
|
|
</div> |
|
|
<ul class="sidebar-nav"> |
|
|
<li class="nav-item"> |
|
|
<a href="#" class="nav-link active"> |
|
|
<i class="fas fa-tachometer-alt me-2"></i> |
|
|
الرئيسية |
|
|
</a> |
|
|
</li> |
|
|
<li class="nav-item"> |
|
|
<a href="#manage-libraries" class="nav-link"> |
|
|
<i class="fas fa-book me-2"></i> |
|
|
إدارة المكتبات |
|
|
</a> |
|
|
</li> |
|
|
<li class="nav-item"> |
|
|
<a href="#" class="nav-link"> |
|
|
<i class="fas fa-donate me-2"></i> |
|
|
التبرعات |
|
|
</a> |
|
|
</li> |
|
|
<li class="nav-item"> |
|
|
<a href="#" class="nav-link"> |
|
|
<i class="fas fa-users me-2"></i> |
|
|
المستخدمين |
|
|
</a> |
|
|
</li> |
|
|
<li class="nav-item"> |
|
|
<a href="#" class="nav-link"> |
|
|
<i class="fas fa-cog me-2"></i> |
|
|
الإعدادات |
|
|
</a> |
|
|
</li> |
|
|
<li class="nav-item"> |
|
|
<a href="../index.html" class="nav-link text-danger"> |
|
|
<i class="fas fa-sign-out-alt me-2"></i> |
|
|
تسجيل الخروج |
|
|
</a> |
|
|
</li> |
|
|
</ul> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="main-content"> |
|
|
|
|
|
<nav class="topbar"> |
|
|
<div class="container-fluid"> |
|
|
<button class="sidebar-toggle"> |
|
|
<i class="fas fa-bars"></i> |
|
|
</button> |
|
|
<div class="d-flex align-items-center"> |
|
|
<span class="me-3">مرحباً، المدير</span> |
|
|
<div class="dropdown"> |
|
|
<a href="#" class="dropdown-toggle" data-bs-toggle="dropdown"> |
|
|
<i class="fas fa-user-circle fa-2x"></i> |
|
|
</a> |
|
|
<ul class="dropdown-menu dropdown-menu-end"> |
|
|
<li><a class="dropdown-item" href="#">الملف الشخصي</a></li> |
|
|
<li><a class="dropdown-item" href="#">الإعدادات</a></li> |
|
|
<li><hr class="dropdown-divider"></li> |
|
|
<li><a class="dropdown-item text-danger" href="../index.html">تسجيل الخروج</a></li> |
|
|
</ul> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</nav> |
|
|
|
|
|
|
|
|
<div class="container-fluid py-4"> |
|
|
|
|
|
<div class="row mb-4"> |
|
|
<div class="col-xl-3 col-md-6 mb-4"> |
|
|
<div class="card summary-card"> |
|
|
<div class="card-body"> |
|
|
<div class="d-flex align-items-center"> |
|
|
<div class="flex-grow-1"> |
|
|
<h5 class="card-title">المكتبات</h5> |
|
|
<h2 class="card-number">8</h2> |
|
|
</div> |
|
|
<div class="icon"> |
|
|
<i class="fas fa-book fa-2x text-primary"></i> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="col-xl-3 col-md-6 mb-4"> |
|
|
<div class="card summary-card"> |
|
|
<div class="card-body"> |
|
|
<div class="d-flex align-items-center"> |
|
|
<div class="flex-grow-1"> |
|
|
<h5 class="card-title">الكتب المجمعة</h5> |
|
|
<h2 class="card-number">42,350</h2> |
|
|
</div> |
|
|
<div class="icon"> |
|
|
<i class="fas fa-book-open fa-2x text-success"></i> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="col-xl-3 col-md-6 mb-4"> |
|
|
<div class="card summary-card"> |
|
|
<div class="card-body"> |
|
|
<div class="d-flex align-items-center"> |
|
|
<div class="flex-grow-1"> |
|
|
<h5 class="card-title">إجمالي التبرعات</h5> |
|
|
<h2 class="card-number">125,000 SDG</h2> |
|
|
</div> |
|
|
<div class="icon"> |
|
|
<i class="fas fa-money-bill-wave fa-2x text-warning"></i> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="col-xl-3 col-md-6 mb-4"> |
|
|
<div class="card summary-card"> |
|
|
<div class="card-body"> |
|
|
<div class="d-flex align-items-center"> |
|
|
<div class="flex-grow-1"> |
|
|
<h5 class="card-title">المتطوعين</h5> |
|
|
<h2 class="card-number">87</h2> |
|
|
</div> |
|
|
<div class="icon"> |
|
|
<i class="fas fa-users fa-2x text-info"></i> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div id="manage-libraries" class="card"> |
|
|
<div class="card-header d-flex justify-content-between align-items-center"> |
|
|
<h5 class="mb-0">إدارة المكتبات</h5> |
|
|
<button class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#addLibraryModal"> |
|
|
<i class="fas fa-plus me-2"></i>إضافة مكتبة جديدة |
|
|
</button> |
|
|
</div> |
|
|
<div class="card-body"> |
|
|
<div class="table-responsive"> |
|
|
<table class="table table-striped"> |
|
|
<thead> |
|
|
<tr> |
|
|
<th>اسم المكتبة</th> |
|
|
<th>الموقع</th> |
|
|
<th>الحالة</th> |
|
|
<th>تاريخ الإنشاء</th> |
|
|
<th>الإجراءات</th> |
|
|
</tr> |
|
|
</thead> |
|
|
<tbody> |
|
|
<tr> |
|
|
<td>مكتبة الحي الأول</td> |
|
|
<td>الحي الأول، بورتسودان</td> |
|
|
<td><span class="badge bg-success">نشط</span></td> |
|
|
<td>2023-03-15</td> |
|
|
<td> |
|
|
<button class="btn btn-sm btn-outline-primary me-1">تعديل</button> |
|
|
<button class="btn btn-sm btn-outline-danger">حذف</button> |
|
|
</td> |
|
|
</tr> |
|
|
<tr> |
|
|
<td>مكتبة الميناء</td> |
|
|
<td>منطقة الميناء، بورتسودان</td> |
|
|
<td><span class="badge bg-success">نشط</span></td> |
|
|
<td>2023-05-20</td> |
|
|
<td> |
|
|
<button class="btn btn-sm btn-outline-primary me-1">تعديل</button> |
|
|
<button class="btn btn-sm btn-outline-danger">حذف</button> |
|
|
</td> |
|
|
</tr> |
|
|
<tr> |
|
|
<td>مكتبة الضاحية</td> |
|
|
<td>الضاحية السكنية، بورتسودان</td> |
|
|
<td><span class="badge bg-warning">قيد الإنشاء</span></td> |
|
|
<td>2024-01-10</td> |
|
|
<td> |
|
|
<button class="btn btn-sm btn-outline-primary me-1">تعديل</button> |
|
|
<button class="btn btn-sm btn-outline-danger">حذف</button> |
|
|
</td> |
|
|
</tr> |
|
|
<tr> |
|
|
<td>مكتبة الطلاب</td> |
|
|
<td>وسط المدينة، بورتسودان</td> |
|
|
<td><span class="badge bg-success">نشط</span></td> |
|
|
<td>2022-11-05</td> |
|
|
<td> |
|
|
<button class="btn btn-sm btn-outline-primary me-1">تعديل</button> |
|
|
<button class="btn btn-sm btn-outline-danger">حذف</button> |
|
|
</td> |
|
|
</tr> |
|
|
</tbody> |
|
|
</table> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="modal fade" id="addLibraryModal" tabindex="-1"> |
|
|
<div class="modal-dialog"> |
|
|
<div class="modal-content"> |
|
|
<div class="modal-header"> |
|
|
<h5 class="modal-title">إضافة مكتبة جديدة</h5> |
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button> |
|
|
</div> |
|
|
<div class="modal-body"> |
|
|
<form> |
|
|
<div class="mb-3"> |
|
|
<label for="libraryName" class="form-label">اسم المكتبة</label> |
|
|
<input type="text" class="form-control" id="libraryName" required> |
|
|
</div> |
|
|
<div class="mb-3"> |
|
|
<label for="libraryLocation" class="form-label">الموقع</label> |
|
|
<input type="text" class="form-control" id="libraryLocation" required> |
|
|
</div> |
|
|
<div class="mb-3"> |
|
|
<label for="libraryStatus" class="form-label">الحالة</label> |
|
|
<select class="form-select" id="libraryStatus" required> |
|
|
<option value="">اختر الحالة</option> |
|
|
<option value="active">نشط</option> |
|
|
<option value="under-construction">قيد الإنشاء</option> |
|
|
<option value="planned">مخطط</option> |
|
|
<option value="digital">رقمية</option> |
|
|
</select> |
|
|
</div> |
|
|
<div class="mb-3"> |
|
|
<label for="libraryDescription" class="form-label">الوصف</label> |
|
|
<textarea class="form-control" id="libraryDescription" rows="3"></textarea> |
|
|
</div> |
|
|
</form> |
|
|
</div> |
|
|
<div class="modal-footer"> |
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">إلغاء</button> |
|
|
<button type="button" class="btn btn-primary">حفظ المكتبة</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script> |
|
|
<script src="../js/admin.js"></script> |
|
|
</body> |
|
|
</html> |
