Files
2026-04-11 14:08:27 +07:00

111 lines
4.5 KiB
Plaintext

<!-- Page Header -->
<div class="page-title-area">
<div>
<h1>Level Management</h1>
<p class="subtitle">All degree levels registered in the system</p>
</div>
</div>
<div class="row g-3">
<!-- Add Form -->
<div class="col-lg-4">
<div class="card border-0">
<div class="card-header">
<h5 class="card-header-title"><i class="fas fa-plus-circle"></i> Add Level</h5>
</div>
<div class="card-body">
<form method="POST" action="/admin/level/create">
<div class="mb-3">
<label class="form-label">Level Name <span class="text-danger">*</span></label>
<input type="text" class="form-control" name="type" placeholder="e.g. Undergraduate, Postgraduate..." required>
</div>
<button type="submit" class="btn btn-primary w-100">
<i class="fas fa-plus"></i> Add Level
</button>
</form>
</div>
</div>
</div>
<!-- Table -->
<div class="col-lg-8">
<div class="card border-0">
<div class="card-header">
<h5 class="card-header-title"><i class="fas fa-layer-group"></i> Levels</h5>
<span class="badge badge-soft-primary"><%= levels ? levels.length : 0 %> total</span>
</div>
<div class="card-body p-0">
<% if (levels && levels.length > 0) { %>
<div class="table-responsive">
<table class="table table-hover align-middle mb-0">
<thead>
<tr>
<th style="width:50px">#</th>
<th>Level Name</th>
<th style="width:130px">Actions</th>
</tr>
</thead>
<tbody>
<% levels.forEach((level, index) => { %>
<tr>
<td style="color:var(--text-muted)"><%= index + 1 %></td>
<td>
<span class="level-type-display-<%= level._id %>" style="font-weight:500"><%= level.type %></span>
<form method="POST" action="/admin/level/<%= level._id %>/edit"
class="level-edit-form-<%= level._id %> d-none d-flex gap-2 align-items-center">
<input type="text" class="form-control form-control-sm" name="type" value="<%= level.type %>" required>
<button type="submit" class="btn btn-sm btn-outline-primary btn-icon" title="Save">
<i class="fas fa-check"></i>
</button>
<button type="button" class="btn btn-sm btn-outline-secondary btn-icon" title="Cancel"
onclick="cancelLevelEdit('<%= level._id %>')">
<i class="fas fa-times"></i>
</button>
</form>
</td>
<td>
<div class="table-actions">
<button type="button" class="btn btn-sm btn-outline-primary btn-icon" title="Edit"
onclick="startLevelEdit('<%= level._id %>')">
<i class="fas fa-pen"></i>
</button>
<form method="POST" action="/admin/level/<%= level._id %>/delete" style="display:inline;"
onsubmit="return confirm('Delete level?')">
<button type="submit" class="btn btn-sm btn-outline-danger btn-icon" title="Delete">
<i class="fas fa-trash"></i>
</button>
</form>
</div>
</td>
</tr>
<% }); %>
</tbody>
</table>
</div>
<% } else { %>
<div class="empty-state">
<div class="empty-state-icon"><i class="fas fa-layer-group"></i></div>
<h5>No levels yet</h5>
<p>Use the form on the left to add the first level.</p>
</div>
<% } %>
</div>
</div>
</div>
</div>
<script>
function startLevelEdit(id) {
document.querySelector('.level-type-display-' + id).classList.add('d-none');
const form = document.querySelector('.level-edit-form-' + id);
form.classList.remove('d-none');
form.classList.add('d-flex');
}
function cancelLevelEdit(id) {
document.querySelector('.level-type-display-' + id).classList.remove('d-none');
const form = document.querySelector('.level-edit-form-' + id);
form.classList.add('d-none');
form.classList.remove('d-flex');
}
</script>