forked from UKSOURCE/cms.hailearning.edu.vn
113 lines
4.7 KiB
Plaintext
113 lines
4.7 KiB
Plaintext
<!-- Page Header -->
|
|
<div class="page-title-area">
|
|
<div>
|
|
<h1>Department Management</h1>
|
|
<p class="subtitle">All departments 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 Department</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<form method="POST" action="/admin/department/create">
|
|
<div class="mb-3">
|
|
<label class="form-label">Department Name <span class="text-danger">*</span></label>
|
|
<input type="text" class="form-control" name="name" placeholder="Enter department name..." required>
|
|
</div>
|
|
<button type="submit" class="btn btn-primary w-100">
|
|
<i class="fas fa-plus"></i> Add Department
|
|
</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-building"></i> Departments</h5>
|
|
<span class="badge badge-soft-primary"><%= departments ? departments.length : 0 %> total</span>
|
|
</div>
|
|
<div class="card-body p-0">
|
|
<% if (departments && departments.length > 0) { %>
|
|
<div class="table-responsive">
|
|
<table class="table table-hover align-middle mb-0">
|
|
<thead>
|
|
<tr>
|
|
<th style="width:50px">#</th>
|
|
<th>Department Name</th>
|
|
<th>Slug</th>
|
|
<th style="width:130px">Actions</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<% departments.forEach((department, index) => { %>
|
|
<tr>
|
|
<td style="color:var(--text-muted)"><%= index + 1 %></td>
|
|
<td>
|
|
<span class="dept-name-display-<%= department._id %>" style="font-weight:500"><%= department.name %></span>
|
|
<form method="POST" action="/admin/department/<%= department._id %>/edit"
|
|
class="dept-edit-form-<%= department._id %> d-none d-flex gap-2 align-items-center">
|
|
<input type="text" class="form-control form-control-sm" name="name" value="<%= department.name %>" 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="cancelEdit('<%= department._id %>')">
|
|
<i class="fas fa-times"></i>
|
|
</button>
|
|
</form>
|
|
</td>
|
|
<td><code style="font-size:0.8rem;color:var(--text-muted)"><%= department.slug %></code></td>
|
|
<td>
|
|
<div class="table-actions">
|
|
<button type="button" class="btn btn-sm btn-outline-primary btn-icon" title="Edit"
|
|
onclick="startEdit('<%= department._id %>')">
|
|
<i class="fas fa-pen"></i>
|
|
</button>
|
|
<form method="POST" action="/admin/department/<%= department._id %>/delete" style="display:inline;"
|
|
onsubmit="return confirm('Delete department \"<%= department.name %>\"?')">
|
|
<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-building"></i></div>
|
|
<h5>No departments yet</h5>
|
|
<p>Use the form on the left to add the first department.</p>
|
|
</div>
|
|
<% } %>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
function startEdit(id) {
|
|
document.querySelector('.dept-name-display-' + id).classList.add('d-none');
|
|
const form = document.querySelector('.dept-edit-form-' + id);
|
|
form.classList.remove('d-none');
|
|
form.classList.add('d-flex');
|
|
}
|
|
function cancelEdit(id) {
|
|
document.querySelector('.dept-name-display-' + id).classList.remove('d-none');
|
|
const form = document.querySelector('.dept-edit-form-' + id);
|
|
form.classList.add('d-none');
|
|
form.classList.remove('d-flex');
|
|
}
|
|
</script>
|